色名 · #F6E8CC
Sumatra
Sumatraは#F6E8CC：rgb(246 232 204)、hsl(40 70% 88%)、oklch(0.935 0.04 84.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Sumatra color name →
#F6E8CC
oklch(0.935 0.04 84.6)
カラー変換
- HEX
- #f6e8cc
- RGB
- rgb(246 232 204)
- HSL
- hsl(40 70% 88%)
- HWB
- hwb(40 80% 4%)
- OKLCH
- oklch(0.935 0.04 84.6)
- OKLab
- oklab(0.935 0.004 0.04)
- CIE Lab
- lab(92.58 1.61 15.48)
- LCH
- lch(92.58 15.56 84.1)
- CMYK
- cmyk(0% 6% 17% 4%)
ティント · シェード · トーン
ティント
- F7EAD1
- F8EDD6
- F9EFDB
- FAF1E0
- FBF4E6
- FBF6EB
- FCF8F0
- FDFAF5
- FEFDFA
シェード
- D6CAB1
- B7AC97
- 98907E
- 7B7465
- 5F594E
- 454037
- 2C2922
- 15130F
- 030302
トーン
- EADDC4
- DDD2BC
- D1C8B5
- C5BDAD
- B9B3A5
- AEA89E
- A29E96
- 96948F
- 8B8A87
カラーハーモニー
補色 +180°
- F6E8CC
Sumatra
- DFEAFF
≈ Husky
類似色 -30° +30°
- F6E8CC
Sumatra
- FFE3D2
≈ Powdered Peach
- E8EDCF
≈ Honeydew Melon
トライアド +120° +240°
- F6E8CC
Sumatra
- CCF2F6
≈ Vaporised
- F8E1F9
≈ Fairy Salt
スプリットコンプリメンタリー +150° +210°
- F6E8CC
Sumatra
- D3EEFF
≈ Ice Castle
- EAE5FF
≈ Cyber Lavender
テトラード +90° +180° +270°
- F6E8CC
Sumatra
- CFF3E8
≈ Minty Fresh
- DFEAFF
≈ Husky
- FFE0EB
≈ Baby Girl
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.21:1 · APCA Lc 10
Ag
AAA黒の上
WCAG 17.33:1 · APCA Lc 94
最適な文字色: #000000
WCAG 17.33:1 (AAA) · APCA Lc 94
Contrast pairs
コードスニペット
CSS
:root {
--sumatra: #f6e8cc;
--sumatra-rgb: 246 232 204;
--sumatra-oklch: oklch(0.935 0.04 84.6);
}
.element {
color: var(--sumatra);
background-color: hsl(40 70% 88%);
border-color: oklch(0.935 0.04 84.6);
}Tailwind CSS v4
@theme {
--color-sumatra: #f6e8cc;
--color-sumatra-50: #faf5e9;
--color-sumatra-100: #eee7d9;
--color-sumatra-200: #dcd3c1;
--color-sumatra-300: #c0b6a1;
--color-sumatra-400: #a99d84;
--color-sumatra-500: #938468;
--color-sumatra-600: #7c7058;
--color-sumatra-700: #635a47;
--color-sumatra-800: #494133;
--color-sumatra-900: #332d22;
--color-sumatra-950: #1e1a12;
}SCSS
$sumatra: #f6e8cc;
$sumatra-rgb: 246, 232, 204;
$sumatra-light: mix(#fff, $sumatra, 20%);
$sumatra-dark: mix(#000, $sumatra, 20%);
.element {
color: $sumatra;
box-shadow: 0 0 0 2px rgba($sumatra, 0.35);
}