色名 · #DCC39F
Natural Rice Beige
Natural Rice Beigeは#DCC39F：rgb(220 195 159)、hsl(35 47% 74%)、oklch(0.829 0.056 76.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Natural Rice Beige color name →
#DCC39F
oklch(0.829 0.056 76.8)
カラー変換
- HEX
- #dcc39f
- RGB
- rgb(220 195 159)
- HSL
- hsl(35 47% 74%)
- HWB
- hwb(35 62% 14%)
- OKLCH
- oklch(0.829 0.056 76.8)
- OKLab
- oklab(0.829 0.013 0.054)
- CIE Lab
- lab(80.26 5.16 21.57)
- LCH
- lch(80.26 22.18 76.6)
- CMYK
- cmyk(0% 11% 28% 14%)
ティント · シェード · トーン
ティント
- E0C9A9
- E3CFB2
- E7D5BC
- EADBC5
- EEE1CF
- F1E7D8
- F5EDE2
- F8F3EC
- FCF9F5
シェード
- BFA98A
- A39075
- 887861
- 6E604D
- 544A3B
- 3C3429
- 262018
- 110E09
- 020201
トーン
- D2BC9C
- C9B599
- C0AF96
- B6A893
- ADA190
- A49A8D
- 9B948A
- 928D86
- 898783
カラーハーモニー
補色 +180°
- DCC39F
Natural Rice Beige
- B0C9EC
≈ Tropical Blue
類似色 -30° +30°
- DCC39F
Natural Rice Beige
- E7BDA9
≈ Orangery
- CBCAA0
≈ Mint Ice Green
トライアド +120° +240°
- DCC39F
Natural Rice Beige
- 9DD3D3
≈ Morning Glory
- D6BCE0
≈ Plum Point
スプリットコンプリメンタリー +150° +210°
- DCC39F
Natural Rice Beige
- A1CFE3
≈ Light Sky Babe
- C4C2EA
≈ Violet Gems
テトラード +90° +180° +270°
- DCC39F
Natural Rice Beige
- A5D3BF
≈ Flowering Cactus
- B0C9EC
≈ Tropical Blue
- E3B9CE
≈ Eau de Rose
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.70:1 · APCA Lc 30
Ag
AAA黒の上
WCAG 12.34:1 · APCA Lc 72
最適な文字色: #000000
WCAG 12.34:1 (AAA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--natural-rice-beige: #dcc39f;
--natural-rice-beige-rgb: 220 195 159;
--natural-rice-beige-oklch: oklch(0.829 0.056 76.8);
}
.element {
color: var(--natural-rice-beige);
background-color: hsl(35 47% 74%);
border-color: oklch(0.829 0.056 76.8);
}Tailwind CSS v4
@theme {
--color-natural-rice-beige: #dcc39f;
--color-natural-rice-beige-50: #fef4e4;
--color-natural-rice-beige-100: #f2e6d4;
--color-natural-rice-beige-200: #e1d2ba;
--color-natural-rice-beige-300: #c7b598;
--color-natural-rice-beige-400: #b19b7a;
--color-natural-rice-beige-500: #9b825c;
--color-natural-rice-beige-600: #836e4e;
--color-natural-rice-beige-700: #69583e;
--color-natural-rice-beige-800: #4e402c;
--color-natural-rice-beige-900: #362c1e;
--color-natural-rice-beige-950: #21190e;
}SCSS
$natural-rice-beige: #dcc39f;
$natural-rice-beige-rgb: 220, 195, 159;
$natural-rice-beige-light: mix(#fff, $natural-rice-beige, 20%);
$natural-rice-beige-dark: mix(#000, $natural-rice-beige, 20%);
.element {
color: $natural-rice-beige;
box-shadow: 0 0 0 2px rgba($natural-rice-beige, 0.35);
}