色名 · #D7B235
Ogen Melon
Ogen Melonは#D7B235：rgb(215 178 53)、hsl(46 67% 53%)、oklch(0.775 0.142 91.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Ogen Melon color name →
#D7B235
oklch(0.775 0.142 91.6)
カラー変換
- HEX
- #d7b235
- RGB
- rgb(215 178 53)
- HSL
- hsl(46 67% 53%)
- HWB
- hwb(46 21% 16%)
- OKLCH
- oklch(0.775 0.142 91.6)
- OKLab
- oklab(0.775 -0.004 0.142)
- CIE Lab
- lab(74.35 4.85 64.63)
- LCH
- lch(74.35 64.81 85.7)
- CMYK
- cmyk(0% 17% 75% 16%)
ティント · シェード · トーン
ティント
- DBBA52
- DFC269
- E3CA7E
- E7D192
- EBD9A5
- EFE1B7
- F3E8C9
- F7F0DB
- FBF8ED
シェード
- BB9A2D
- 9F8325
- 856D1D
- 6B5715
- 52430E
- 3B2F08
- 251D03
- 110C01
- 020100
トーン
- CEAD44
- C5A84F
- BCA358
- B39F60
- AB9A67
- A2956D
- 999073
- 918A77
- 88857C
カラーハーモニー
補色 +180°
- D7B235
Ogen Melon
- 9CB2FF
≈ Wondrous Wisteria
類似色 -30° +30°
- D7B235
Ogen Melon
- F69F4C
≈ Sunshade
- A8C454
≈ Sweet Midori
トライアド +120° +240°
- D7B235
Ogen Melon
- 00CCE7
≈ Picnic Day Sky
- EA93DF
≈ Love Dust
スプリットコンプリメンタリー +150° +210°
- D7B235
Ogen Melon
- 65BFFF
≈ Broken Blue
- C6A0FF
≈ Diva
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.03:1 · APCA Lc 39
Ag
AAA黒の上
WCAG 10.30:1 · APCA Lc 63
最適な文字色: #000000
WCAG 10.30:1 (AAA) · APCA Lc 63
Contrast pairs
コードスニペット
CSS
:root {
--ogen-melon: #d7b235;
--ogen-melon-rgb: 215 178 53;
--ogen-melon-oklch: oklch(0.775 0.142 91.6);
}
.element {
color: var(--ogen-melon);
background-color: hsl(46 67% 53%);
border-color: oklch(0.775 0.142 91.6);
}Tailwind CSS v4
@theme {
--color-ogen-melon: #d7b235;
--color-ogen-melon-50: #fff5c8;
--color-ogen-melon-100: #f8e8b2;
--color-ogen-melon-200: #e8d48d;
--color-ogen-melon-300: #d0b65c;
--color-ogen-melon-400: #bd9b20;
--color-ogen-melon-500: #a98000;
--color-ogen-melon-600: #8e6d00;
--color-ogen-melon-700: #725700;
--color-ogen-melon-800: #563f00;
--color-ogen-melon-900: #3c2b00;
--color-ogen-melon-950: #261800;
}SCSS
$ogen-melon: #d7b235;
$ogen-melon-rgb: 215, 178, 53;
$ogen-melon-light: mix(#fff, $ogen-melon, 20%);
$ogen-melon-dark: mix(#000, $ogen-melon, 20%);
.element {
color: $ogen-melon;
box-shadow: 0 0 0 2px rgba($ogen-melon, 0.35);
}