色名 · #ECE5CF
Floating Island
Floating Islandは#ECE5CF：rgb(236 229 207)、hsl(46 43% 87%)、oklch(0.922 0.03 92.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Floating Island color name →
#ECE5CF
oklch(0.922 0.03 92.3)
カラー変換
- HEX
- #ece5cf
- RGB
- rgb(236 229 207)
- HSL
- hsl(46 43% 87%)
- HWB
- hwb(46 81% 7%)
- OKLCH
- oklch(0.922 0.03 92.3)
- OKLab
- oklab(0.922 -0.001 0.03)
- CIE Lab
- lab(91.06 -0.26 11.66)
- LCH
- lch(91.06 11.67 91.3)
- CMYK
- cmyk(0% 3% 12% 7%)
ティント · シェード · トーン
ティント
- EEE8D4
- F0EAD9
- F2EDDD
- F4EFE2
- F5F2E7
- F7F5EC
- F9F7F1
- FBFAF5
- FDFCFA
シェード
- CDC7B4
- AFAA99
- 928E7F
- 767267
- 5B584F
- 423F38
- 292823
- 131210
- 030302
トーン
- E1DAC7
- D5D0BF
- CAC6B7
- BFBBAF
- B4B1A7
- AAA79F
- 9F9D97
- 95938F
- 8A8A88
カラーハーモニー
補色 +180°
- ECE5CF
Floating Island
- DEE4FA
≈ Lavender Mist
類似色 -30° +30°
- ECE5CF
Floating Island
- F4E1D1
≈ Muffin Mix
- E1E9D3
≈ Mediterranean Green
トライアド +120° +240°
- ECE5CF
Floating Island
- CFEBF1
≈ Chalky Blue White
- F2DEEE
≈ Divine Dove
スプリットコンプリメンタリー +150° +210°
- ECE5CF
Floating Island
- D4E8F8
≈ Freezing Vapour
- E9E1F6
≈ Sheer Lavender
テトラード +90° +180° +270°
- ECE5CF
Floating Island
- D0ECE7
≈ Spa
- DEE4FA
≈ Lavender Mist
- F8DDE3
≈ Marshmallow Heart
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.25:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.67:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.67:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--floating-island: #ece5cf;
--floating-island-rgb: 236 229 207;
--floating-island-oklch: oklch(0.922 0.03 92.3);
}
.element {
color: var(--floating-island);
background-color: hsl(46 43% 87%);
border-color: oklch(0.922 0.03 92.3);
}Tailwind CSS v4
@theme {
--color-floating-island: #ece5cf;
--color-floating-island-50: #f8f5ec;
--color-floating-island-100: #ebe8dd;
--color-floating-island-200: #d8d4c6;
--color-floating-island-300: #bcb7a6;
--color-floating-island-400: #a59e8b;
--color-floating-island-500: #8d8670;
--color-floating-island-600: #77715f;
--color-floating-island-700: #5f5b4c;
--color-floating-island-800: #464237;
--color-floating-island-900: #312e25;
--color-floating-island-950: #1d1a14;
}SCSS
$floating-island: #ece5cf;
$floating-island-rgb: 236, 229, 207;
$floating-island-light: mix(#fff, $floating-island, 20%);
$floating-island-dark: mix(#000, $floating-island, 20%);
.element {
color: $floating-island;
box-shadow: 0 0 0 2px rgba($floating-island, 0.35);
}