色名 · #CF714A
Coral Gold
Coral Goldは#CF714A：rgb(207 113 74)、hsl(18 58% 55%)、oklch(0.647 0.13 42.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Coral Gold color name →
#CF714A
oklch(0.647 0.13 42.6)
カラー変換
- HEX
- #cf714a
- RGB
- rgb(207 113 74)
- HSL
- hsl(18 58% 55%)
- HWB
- hwb(18 29% 19%)
- OKLCH
- oklch(0.647 0.13 42.6)
- OKLab
- oklab(0.647 0.096 0.088)
- CIE Lab
- lab(58.17 35.44 38.5)
- LCH
- lch(58.17 52.33 47.4)
- CMYK
- cmyk(0% 45% 64% 19%)
ティント · シェード · トーン
ティント
- D5805D
- DB8E6F
- E19C81
- E6AA92
- EBB8A4
- EFC6B6
- F4D4C8
- F8E3DA
- FCF1ED
シェード
- B4613F
- 995235
- 7F432A
- 673520
- 4F2717
- 381A0E
- 230E06
- 100402
- 020100
トーン
- C87351
- C07557
- B9775D
- B17963
- A97B68
- A27C6D
- 9A7D72
- 917E77
- 897F7B
カラーハーモニー
補色 +180°
- CF714A
Coral Gold
- 009EC3
≈ Blue Ocean
類似色 -30° +30°
- CF714A
Coral Gold
- D16A78
≈ Mexican Chile
- BE801C
≈ Turmeric Brown
トライアド +120° +240°
- CF714A
Coral Gold
- 26A677
≈ Cǎo Lǜ Grass
- 8383DB
≈ Indigo Bloom
スプリットコンプリメンタリー +150° +210°
- CF714A
Coral Gold
- 00A3A0
≈ Silken Jade
- 4F91DB
≈ Blue Dart
テトラード +90° +180° +270°
- CF714A
Coral Gold
- 6F9F46
≈ Indubitably Green
- 009EC3
≈ Blue Ocean
- A975C7
≈ Wisteria
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.43:1 · APCA Lc 61
Ag
AA黒の上
WCAG 6.11:1 · APCA Lc 40
最適な文字色: #000000
WCAG 6.11:1 (AA) · APCA Lc 40
Contrast pairs
コードスニペット
CSS
:root {
--coral-gold: #cf714a;
--coral-gold-rgb: 207 113 74;
--coral-gold-oklch: oklch(0.647 0.13 42.6);
}
.element {
color: var(--coral-gold);
background-color: hsl(18 58% 55%);
border-color: oklch(0.647 0.13 42.6);
}Tailwind CSS v4
@theme {
--color-coral-gold: #cf714a;
--color-coral-gold-50: #ffead7;
--color-coral-gold-100: #ffdbc5;
--color-coral-gold-200: #ffc3a7;
--color-coral-gold-300: #efa280;
--color-coral-gold-400: #de835e;
--color-coral-gold-500: #cb6538;
--color-coral-gold-600: #ac5631;
--color-coral-gold-700: #8a4427;
--color-coral-gold-800: #67311c;
--color-coral-gold-900: #482112;
--color-coral-gold-950: #2f1005;
}SCSS
$coral-gold: #cf714a;
$coral-gold-rgb: 207, 113, 74;
$coral-gold-light: mix(#fff, $coral-gold, 20%);
$coral-gold-dark: mix(#000, $coral-gold, 20%);
.element {
color: $coral-gold;
box-shadow: 0 0 0 2px rgba($coral-gold, 0.35);
}