色名 · #FAD48B
Orange Chalk
Orange Chalkは#FAD48B：rgb(250 212 139)、hsl(39 92% 76%)、oklch(0.886 0.101 83)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Orange Chalk color name →
#FAD48B
oklch(0.886 0.101 83)
カラー変換
- HEX
- #fad48b
- RGB
- rgb(250 212 139)
- HSL
- hsl(39 92% 76%)
- HWB
- hwb(39 55% 2%)
- OKLCH
- oklch(0.886 0.101 83)
- OKLab
- oklab(0.886 0.012 0.1)
- CIE Lab
- lab(87.01 6.92 41.23)
- LCH
- lch(87.01 41.81 80.5)
- CMYK
- cmyk(0% 15% 44% 2%)
ティント · シェード · トーン
ティント
- FBD898
- FBDDA4
- FCE1B0
- FCE6BB
- FDEAC7
- FDEED2
- FEF2DD
- FEF7E9
- FFFBF4
シェード
- D9B878
- BA9D66
- 9B8354
- 7D6943
- 615132
- 463A23
- 2D2414
- 151007
- 030201
トーン
- EDCB8B
- E1C38A
- D4BA8A
- C8B289
- BBA988
- AFA187
- A39985
- 979084
- 8C8882
カラーハーモニー
補色 +180°
- FAD48B
Orange Chalk
- C7DAFF
≈ Arc Light
類似色 -30° +30°
- FAD48B
Orange Chalk
- FFCEB0
≈ Blushing Cherub
- D9E193
≈ Charming Green
トライアド +120° +240°
- FAD48B
Orange Chalk
- 81EDF7
≈ Photon Projector
- F9C4FF
≈ Electric Lavender
スプリットコンプリメンタリー +150° +210°
- FAD48B
Orange Chalk
- AEE2FF
≈ Frozen Landscape
- DAD3FF
≈ Pale Lavender
テトラード +90° +180° +270°
- FAD48B
Orange Chalk
- 8FF0D3
≈ Tiffany Blue
- C7DAFF
≈ Arc Light
- FFC7DD
≈ Cherry Blush
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.41:1 · APCA Lc 20
Ag
AAA黒の上
WCAG 14.85:1 · APCA Lc 84
最適な文字色: #000000
WCAG 14.85:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--orange-chalk: #fad48b;
--orange-chalk-rgb: 250 212 139;
--orange-chalk-oklch: oklch(0.886 0.101 83);
}
.element {
color: var(--orange-chalk);
background-color: hsl(39 92% 76%);
border-color: oklch(0.886 0.101 83);
}Tailwind CSS v4
@theme {
--color-orange-chalk: #fad48b;
--color-orange-chalk-50: #fff4d5;
--color-orange-chalk-100: #f7e6c2;
--color-orange-chalk-200: #e8d2a3;
--color-orange-chalk-300: #cfb47b;
--color-orange-chalk-400: #bb9955;
--color-orange-chalk-500: #a67f2a;
--color-orange-chalk-600: #8d6c26;
--color-orange-chalk-700: #71561e;
--color-orange-chalk-800: #543e14;
--color-orange-chalk-900: #3b2b0c;
--color-orange-chalk-950: #251801;
}SCSS
$orange-chalk: #fad48b;
$orange-chalk-rgb: 250, 212, 139;
$orange-chalk-light: mix(#fff, $orange-chalk, 20%);
$orange-chalk-dark: mix(#000, $orange-chalk, 20%);
.element {
color: $orange-chalk;
box-shadow: 0 0 0 2px rgba($orange-chalk, 0.35);
}