色名 · #D6B63D
Oldies but Goldies
Oldies but Goldiesは#D6B63D：rgb(214 182 61)、hsl(47 65% 54%)、oklch(0.783 0.14 93.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Oldies but Goldies color name →
#D6B63D
oklch(0.783 0.14 93.8)
カラー変換
- HEX
- #d6b63d
- RGB
- rgb(214 182 61)
- HSL
- hsl(47 65% 54%)
- HWB
- hwb(47 24% 16%)
- OKLCH
- oklch(0.783 0.14 93.8)
- OKLab
- oklab(0.783 -0.009 0.139)
- CIE Lab
- lab(75.31 2.69 62.56)
- LCH
- lch(75.31 62.61 87.5)
- CMYK
- cmyk(0% 15% 71% 16%)
ティント · シェード · トーン
ティント
- DABE57
- DEC56D
- E2CC82
- E6D495
- EADBA7
- EEE2B9
- F3EACB
- F7F1DC
- FBF8EE
シェード
- BA9E34
- 9E862B
- 846F22
- 6A591A
- 524412
- 3B300A
- 251D04
- 100C01
- 020200
トーン
- CDB14A
- C4AB54
- BBA65C
- B3A163
- AA9B69
- A1966F
- 999174
- 918B78
- 88867C
カラーハーモニー
補色 +180°
- D6B63D
Oldies but Goldies
- A2B3FF
≈ Wondrous Wisteria
類似色 -30° +30°
- D6B63D
Oldies but Goldies
- F6A34E
≈ Troll Slayer Orange
- A6C75C
≈ Green Glow
トライアド +120° +240°
- D6B63D
Oldies but Goldies
- 00CEEE
≈ Picnic Day Sky
- EE95DD
≈ Love Dust
スプリットコンプリメンタリー +150° +210°
- D6B63D
Oldies but Goldies
- 71C1FF
≈ Maya Blue
- CBA2FF
≈ Hydrangea Purple
テトラード +90° +180° +270°
- D6B63D
Oldies but Goldies
- 00D5C2
≈ Turquoise Panic
- A2B3FF
≈ Wondrous Wisteria
- FF92AF
≈ Baker-Miller Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.97:1 · APCA Lc 38
Ag
AAA黒の上
WCAG 10.61:1 · APCA Lc 64
最適な文字色: #000000
WCAG 10.61:1 (AAA) · APCA Lc 64
Contrast pairs
コードスニペット
CSS
:root {
--oldies-but-goldies: #d6b63d;
--oldies-but-goldies-rgb: 214 182 61;
--oldies-but-goldies-oklch: oklch(0.783 0.14 93.8);
}
.element {
color: var(--oldies-but-goldies);
background-color: hsl(47 65% 54%);
border-color: oklch(0.783 0.14 93.8);
}Tailwind CSS v4
@theme {
--color-oldies-but-goldies: #d6b63d;
--color-oldies-but-goldies-50: #fff6c9;
--color-oldies-but-goldies-100: #f6e8b3;
--color-oldies-but-goldies-200: #e6d58f;
--color-oldies-but-goldies-300: #cdb75f;
--color-oldies-but-goldies-400: #ba9c26;
--color-oldies-but-goldies-500: #a58200;
--color-oldies-but-goldies-600: #8b6e00;
--color-oldies-but-goldies-700: #705800;
--color-oldies-but-goldies-800: #544000;
--color-oldies-but-goldies-900: #3a2c00;
--color-oldies-but-goldies-950: #251900;
}SCSS
$oldies-but-goldies: #d6b63d;
$oldies-but-goldies-rgb: 214, 182, 61;
$oldies-but-goldies-light: mix(#fff, $oldies-but-goldies, 20%);
$oldies-but-goldies-dark: mix(#000, $oldies-but-goldies, 20%);
.element {
color: $oldies-but-goldies;
box-shadow: 0 0 0 2px rgba($oldies-but-goldies, 0.35);
}