色名 · #CDA563
Caribou Herd
Caribou Herdは#CDA563：rgb(205 165 99)、hsl(37 51% 60%)、oklch(0.744 0.096 79)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Caribou Herd color name →
#CDA563
oklch(0.744 0.096 79)
カラー変換
- HEX
- #cda563
- RGB
- rgb(205 165 99)
- HSL
- hsl(37 51% 60%)
- HWB
- hwb(37 39% 20%)
- OKLCH
- oklch(0.744 0.096 79)
- OKLab
- oklab(0.744 0.018 0.095)
- CIE Lab
- lab(70.39 9.3 39.8)
- LCH
- lch(70.39 40.88 76.8)
- CMYK
- cmyk(0% 20% 52% 20%)
ティント · シェード · トーン
ティント
- D2AE73
- D7B783
- DCC093
- E1C9A3
- E6D2B2
- EBDBC1
- F0E4D1
- F5EDE0
- FAF6EF
シェード
- B28F55
- 987947
- 7E653A
- 66512E
- 4E3D21
- 382B16
- 231A0B
- 0F0A03
- 020100
トーン
- C5A167
- BD9E6B
- B69A6F
- AE9772
- A69375
- 9E8F77
- 978B7A
- 8F887C
- 88847E
カラーハーモニー
補色 +180°
- CDA563
Caribou Herd
- 87AEE9
≈ Queer Blue
類似色 -30° +30°
- CDA563
Caribou Herd
- DE9A75
≈ Totally Toffee
- B1B167
≈ Rodham
トライアド +120° +240°
- CDA563
Caribou Herd
- 56BFC3
≈ Gem Turquoise
- C799D3
≈ Mauve Mist
スプリットコンプリメンタリー +150° +210°
- CDA563
Caribou Herd
- 65B8DD
≈ Malibu
- AAA2E6
≈ Violet Velvet
テトラード +90° +180° +270°
- CDA563
Caribou Herd
- 69C0A2
≈ Spearmint
- 87AEE9
≈ Queer Blue
- DA93B6
≈ Techno Pink
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 2.29:1 · APCA Lc 45
Ag
AAA黒の上
WCAG 9.15:1 · APCA Lc 57
最適な文字色: #000000
WCAG 9.15:1 (AAA) · APCA Lc 57
Contrast pairs
コードスニペット
CSS
:root {
--caribou-herd: #cda563;
--caribou-herd-rgb: 205 165 99;
--caribou-herd-oklch: oklch(0.744 0.096 79);
}
.element {
color: var(--caribou-herd);
background-color: hsl(37 51% 60%);
border-color: oklch(0.744 0.096 79);
}Tailwind CSS v4
@theme {
--color-caribou-herd: #cda563;
--color-caribou-herd-50: #fff3d7;
--color-caribou-herd-100: #f9e5c4;
--color-caribou-herd-200: #ead1a6;
--color-caribou-herd-300: #d1b37e;
--color-caribou-herd-400: #bd985a;
--color-caribou-herd-500: #a87e32;
--color-caribou-herd-600: #8e6b2c;
--color-caribou-herd-700: #725523;
--color-caribou-herd-800: #553e17;
--color-caribou-herd-900: #3b2a0f;
--color-caribou-herd-950: #251803;
}SCSS
$caribou-herd: #cda563;
$caribou-herd-rgb: 205, 165, 99;
$caribou-herd-light: mix(#fff, $caribou-herd, 20%);
$caribou-herd-dark: mix(#000, $caribou-herd, 20%);
.element {
color: $caribou-herd;
box-shadow: 0 0 0 2px rgba($caribou-herd, 0.35);
}