色名 · #FFC64D
Golden Promise
Golden Promiseは#FFC64D：rgb(255 198 77)、hsl(41 100% 65%)、oklch(0.857 0.148 82.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Golden Promise color name →
#FFC64D
oklch(0.857 0.148 82.9)
カラー変換
- HEX
- #ffc64d
- RGB
- rgb(255 198 77)
- HSL
- hsl(41 100% 65%)
- HWB
- hwb(41 30% 0%)
- OKLCH
- oklch(0.857 0.148 82.9)
- OKLab
- oklab(0.857 0.018 0.147)
- CIE Lab
- lab(83.54 12.52 65.93)
- LCH
- lch(83.54 67.11 79.2)
- CMYK
- cmyk(0% 22% 70% 0%)
ティント · シェード · トーン
ティント
- FFCC65
- FFD27A
- FFD88C
- FFDE9E
- FFE4AF
- FFE9C0
- FFEFD0
- FFF4E0
- FFFAEF
シェード
- DEAC42
- BE9237
- 9E7A2C
- 806222
- 634B18
- 48350F
- 2E2107
- 160E02
- 030200
トーン
- F2BF57
- E5B85F
- D8B166
- CBAA6C
- BEA371
- B19C75
- A59579
- 988E7B
- 8C877E
カラーハーモニー
補色 +180°
- FFC64D
Golden Promise
- B8D1FF
≈ Ice Cold Stare
類似色 -30° +30°
- FFC64D
Golden Promise
- FFC09A
≈ Blushing Cinnamon
- D1DA5D
≈ Chinese Green
トライアド +120° +240°
- FFC64D
Golden Promise
- 00EBFA
≈ Whimsical Blue
- F7B4FF
≈ Strawberry Buttercream
スプリットコンプリメンタリー +150° +210°
- FFC64D
Golden Promise
- 97DAFF
≈ Shiva Blue
- D1C7FF
≈ Innocent Snowdrop
テトラード +90° +180° +270°
- FFC64D
Golden Promise
- 45EFC6
≈ Aphrodite Aqua
- B8D1FF
≈ Ice Cold Stare
- FFB8D5
≈ Candy Bar
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.56:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.43:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.43:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--golden-promise: #ffc64d;
--golden-promise-rgb: 255 198 77;
--golden-promise-oklch: oklch(0.857 0.148 82.9);
}
.element {
color: var(--golden-promise);
background-color: hsl(41 100% 65%);
border-color: oklch(0.857 0.148 82.9);
}Tailwind CSS v4
@theme {
--color-golden-promise: #ffc64d;
--color-golden-promise-50: #fff3c5;
--color-golden-promise-100: #ffe5af;
--color-golden-promise-200: #f2d089;
--color-golden-promise-300: #dab157;
--color-golden-promise-400: #c99510;
--color-golden-promise-500: #b57900;
--color-golden-promise-600: #996700;
--color-golden-promise-700: #7b5200;
--color-golden-promise-800: #5c3b00;
--color-golden-promise-900: #402900;
--color-golden-promise-950: #291600;
}SCSS
$golden-promise: #ffc64d;
$golden-promise-rgb: 255, 198, 77;
$golden-promise-light: mix(#fff, $golden-promise, 20%);
$golden-promise-dark: mix(#000, $golden-promise, 20%);
.element {
color: $golden-promise;
box-shadow: 0 0 0 2px rgba($golden-promise, 0.35);
}