色名 · #DDEEFF
Calcareous Sinter
Calcareous Sinterは#DDEEFF：rgb(221 238 255)、hsl(210 100% 93%)、oklch(0.942 0.029 248.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Calcareous Sinter color name →
#DDEEFF
oklch(0.942 0.029 248.1)
カラー変換
- HEX
- #ddeeff
- RGB
- rgb(221 238 255)
- HSL
- hsl(210 100% 93%)
- HWB
- hwb(210 87% 0%)
- OKLCH
- oklch(0.942 0.029 248.1)
- OKLab
- oklab(0.942 -0.011 -0.027)
- CIE Lab
- lab(93.21 -3.33 -10.25)
- LCH
- lch(93.21 10.78 252)
- CMYK
- cmyk(13% 7% 0% 0%)
ティント · シェード · トーン
ティント
- E0F0FF
- E4F1FF
- E7F3FF
- EBF5FF
- EEF7FF
- F1F8FF
- F5FAFF
- F8FCFF
- FCFDFF
シェード
- C0CFDE
- A4B1BE
- 88939E
- 6E7780
- 555C63
- 3D4248
- 262A2E
- 111416
- 020303
トーン
- D3E2F2
- CAD7E4
- C0CCD7
- B7C1CA
- ADB5BE
- A4ABB1
- 9BA0A4
- 929598
- 898A8C
カラーハーモニー
補色 +180°
- DDEEFF
Calcareous Sinter
- F9E9D7
≈ Pignoli
類似色 -30° +30°
- DDEEFF
Calcareous Sinter
- D7F1F9
≈ Water
- E7EAFF
≈ Glitter
トライアド +120° +240°
- DDEEFF
Calcareous Sinter
- FEE4E8
≈ Hepatica
- E6F0DB
≈ Maison Verte
スプリットコンプリメンタリー +150° +210°
- DDEEFF
Calcareous Sinter
- FEE6DE
≈ French Manicure
- F1ECD6
≈ Tambourine
テトラード +90° +180° +270°
- DDEEFF
Calcareous Sinter
- FAE5F3
≈ Cherry Pearl
- F9E9D7
≈ Pignoli
- DCF2E4
≈ Aloe Mist
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.18:1 · APCA Lc 9
Ag
AAA黒の上
WCAG 17.74:1 · APCA Lc 95
最適な文字色: #000000
WCAG 17.74:1 (AAA) · APCA Lc 95
Contrast pairs
コードスニペット
CSS
:root {
--calcareous-sinter: #ddeeff;
--calcareous-sinter-rgb: 221 238 255;
--calcareous-sinter-oklch: oklch(0.942 0.029 248.1);
}
.element {
color: var(--calcareous-sinter);
background-color: hsl(210 100% 93%);
border-color: oklch(0.942 0.029 248.1);
}Tailwind CSS v4
@theme {
--color-calcareous-sinter: #ddeeff;
--color-calcareous-sinter-50: #eff6fd;
--color-calcareous-sinter-100: #e1e9f2;
--color-calcareous-sinter-200: #cbd5e1;
--color-calcareous-sinter-300: #adb9c6;
--color-calcareous-sinter-400: #91a0af;
--color-calcareous-sinter-500: #778899;
--color-calcareous-sinter-600: #657381;
--color-calcareous-sinter-700: #515c68;
--color-calcareous-sinter-800: #3a444c;
--color-calcareous-sinter-900: #282f35;
--color-calcareous-sinter-950: #161b20;
}SCSS
$calcareous-sinter: #ddeeff;
$calcareous-sinter-rgb: 221, 238, 255;
$calcareous-sinter-light: mix(#fff, $calcareous-sinter, 20%);
$calcareous-sinter-dark: mix(#000, $calcareous-sinter, 20%);
.element {
color: $calcareous-sinter;
box-shadow: 0 0 0 2px rgba($calcareous-sinter, 0.35);
}