色名 · #00FFDD
Ice Ice Baby
Ice Ice Babyは#00FFDD：rgb(0 255 221)、hsl(172 100% 50%)、oklch(0.895 0.164 178.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Ice Ice Baby color name →
#00FFDD
oklch(0.895 0.164 178.3)
カラー変換
- HEX
- #00ffdd
- RGB
- rgb(0 255 221)
- HSL
- hsl(172 100% 50%)
- HWB
- hwb(172 0% 0%)
- OKLCH
- oklch(0.895 0.164 178.3)
- OKLab
- oklab(0.895 -0.164 0.005)
- CIE Lab
- lab(89.89 -57.82 1.39)
- LCH
- lch(89.89 57.84 178.6)
- CMYK
- cmyk(100% 0% 13% 0%)
ティント · シェード · トーン
ティント
- 4FFFE0
- 6FFFE4
- 88FFE7
- 9EFFEA
- B0FFEE
- C2FFF1
- D2FFF5
- E2FFF8
- F1FFFC
シェード
- 00DEC0
- 00BEA4
- 009E88
- 00806E
- 006355
- 00483D
- 002E26
- 001611
- 000302
トーン
- 3AF2D3
- 50E5CA
- 5ED8C0
- 68CBB7
- 70BEAD
- 76B2A4
- 7AA59B
- 7D9992
- 7F8C89
カラーハーモニー
補色 +180°
- 00FFDD
Ice Ice Baby
- FFCCDC
≈ Linnet Egg Red
類似色 -30° +30°
- 00FFDD
Ice Ice Baby
- 88FA9D
≈ Mild Menthol
- 87EFFF
≈ Photon Projector
トライアド +120° +240°
- 00FFDD
Ice Ice Baby
- E1D5FF
≈ Pale Lavender
- FFD2B1
≈ Papaya Whip
スプリットコンプリメンタリー +150° +210°
- 00FFDD
Ice Ice Baby
- FFC7FC
≈ Sugar Chic
- FFCFC8
≈ Snow Pa
テトラード +90° +180° +270°
- 00FFDD
Ice Ice Baby
- CEDCFF
≈ Arc Light
- FFCCDC
≈ Linnet Egg Red
- FFD873
≈ Honey Glaze
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.28:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.34:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.34:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--ice-ice-baby: #00ffdd;
--ice-ice-baby-rgb: 0 255 221;
--ice-ice-baby-oklch: oklch(0.895 0.164 178.3);
}
.element {
color: var(--ice-ice-baby);
background-color: hsl(172 100% 50%);
border-color: oklch(0.895 0.164 178.3);
}Tailwind CSS v4
@theme {
--color-ice-ice-baby: #00ffdd;
--color-ice-ice-baby-50: #c2fff7;
--color-ice-ice-baby-100: #aafbea;
--color-ice-ice-baby-200: #7debd7;
--color-ice-ice-baby-300: #31d2bb;
--color-ice-ice-baby-400: #00bd9f;
--color-ice-ice-baby-500: #00a787;
--color-ice-ice-baby-600: #008d72;
--color-ice-ice-baby-700: #00715b;
--color-ice-ice-baby-800: #005340;
--color-ice-ice-baby-900: #003a2c;
--color-ice-ice-baby-950: #00241a;
}SCSS
$ice-ice-baby: #00ffdd;
$ice-ice-baby-rgb: 0, 255, 221;
$ice-ice-baby-light: mix(#fff, $ice-ice-baby, 20%);
$ice-ice-baby-dark: mix(#000, $ice-ice-baby, 20%);
.element {
color: $ice-ice-baby;
box-shadow: 0 0 0 2px rgba($ice-ice-baby, 0.35);
}