最も近い色名 · #DDF0FF
#DDF0FF
最も近い色名: Cloudless
#DDF0FF（rgb(221 240 255)、hsl(206 100% 93%)、oklch(0.946 0.029 241.6)）に最も近い色名はCloudlessです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#DDF0FF
oklch(0.946 0.029 241.6)
カラー変換
- HEX
- #ddf0ff
- RGB
- rgb(221 240 255)
- HSL
- hsl(206 100% 93%)
- HWB
- hwb(206 87% 0%)
- OKLCH
- oklch(0.946 0.029 241.6)
- OKLab
- oklab(0.946 -0.014 -0.025)
- CIE Lab
- lab(93.72 -4.28 -9.5)
- LCH
- lch(93.72 10.42 245.7)
- CMYK
- cmyk(13% 6% 0% 0%)
ティント · シェード · トーン
ティント
- E0F2FF
- E4F3FF
- E7F5FF
- EBF6FF
- EEF8FF
- F1F9FF
- F5FBFF
- F8FCFF
- FCFEFF
シェード
- C0D1DE
- A4B2BE
- 88959E
- 6E7880
- 555D63
- 3D4348
- 262A2E
- 111416
- 020303
トーン
- D3E4F2
- CAD9E4
- C0CDD7
- B7C2CA
- ADB6BE
- A4ABB1
- 9BA0A4
- 929598
- 898B8C
カラーハーモニー
補色 +180°
- DDF0FF
Cloudless
- FCE9DA
≈ Guiding Star
類似色 -30° +30°
- DDF0FF
Cloudless
- D8F3F8
≈ Let It Snow
- E7EDFF
≈ Brilliant White
トライアド +120° +240°
- DDF0FF
Cloudless
- FFE6EC
≈ Nosegay
- EAF0DB
≈ Memoir
スプリットコンプリメンタリー +150° +210°
- DDF0FF
Cloudless
- FFE7E2
≈ Olm Pink
- F4EDD8
≈ Satin Weave
テトラード +90° +180° +270°
- DDF0FF
Cloudless
- F9E6F6
≈ Cherry Pearl
- FCE9DA
≈ Guiding Star
- E0F3E4
≈ Frosted Mint
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.16:1 · APCA Lc 8
Ag
AAA黒の上
WCAG 17.98:1 · APCA Lc 96
最適な文字色: #000000
WCAG 17.98:1 (AAA) · APCA Lc 96
Contrast pairs
コードスニペット
CSS
:root {
--cloudless: #ddf0ff;
--cloudless-rgb: 221 240 255;
--cloudless-oklch: oklch(0.946 0.029 241.6);
}
.element {
color: var(--cloudless);
background-color: hsl(206 100% 93%);
border-color: oklch(0.946 0.029 241.6);
}Tailwind CSS v4
@theme {
--color-cloudless: #ddf0ff;
--color-cloudless-50: #eef6fd;
--color-cloudless-100: #e0e9f1;
--color-cloudless-200: #cad6e0;
--color-cloudless-300: #abb9c5;
--color-cloudless-400: #90a1ae;
--color-cloudless-500: #768998;
--color-cloudless-600: #647480;
--color-cloudless-700: #505d67;
--color-cloudless-800: #3a444b;
--color-cloudless-900: #272f34;
--color-cloudless-950: #161b20;
}SCSS
$cloudless: #ddf0ff;
$cloudless-rgb: 221, 240, 255;
$cloudless-light: mix(#fff, $cloudless, 20%);
$cloudless-dark: mix(#000, $cloudless, 20%);
.element {
color: $cloudless;
box-shadow: 0 0 0 2px rgba($cloudless, 0.35);
}