Nächste benannte Farbe · #D3DAF1
#D3DAF1
Nächste benannte Farbe: Puffy Cloud
#D3DAF1 (rgb(211 218 241), hsl(226 52% 89%), oklch(0.89 0.032 272.2)) liegt am nächsten an der benannten Farbe Puffy Cloud. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#D3DAF1
oklch(0.89 0.032 272.2)
Farbumrechnungen
- HEX
- #d3daf1
- RGB
- rgb(211 218 241)
- HSL
- hsl(226 52% 89%)
- HWB
- hwb(226 83% 5%)
- OKLCH
- oklch(0.89 0.032 272.2)
- OKLab
- oklab(0.89 0.001 -0.032)
- CIE Lab
- lab(87.04 0.9 -12.15)
- LCH
- lch(87.04 12.19 274.2)
- CMYK
- cmyk(12% 10% 0% 5%)
Tints · Shades · Tones
Tints
- D7DEF2
- DCE1F4
- E0E5F5
- E4E9F7
- E9ECF8
- EDF0FA
- F2F4FB
- F6F8FC
- FBFBFE
Shades
- B7BDD2
- 9CA2B3
- 828795
- 696C79
- 51545D
- 3A3C43
- 24252B
- 101114
- 020203
Tones
- CAD1E5
- C2C7D9
- B9BECE
- B1B5C2
- A9ACB7
- A0A3AC
- 989AA1
- 909196
- 88898B
Farbharmonien
Komplementär +180°
- D3DAF1
Puffy Cloud
- E2DBC3
≈ Belvedere Cream
Analog -30° +30°
- D3DAF1
Puffy Cloud
- C9DEEF
≈ Blue Booties
- DED6ED
≈ Light Purity
Triadisch +120° +240°
- D3DAF1
Puffy Cloud
- EFD4CD
≈ Va Va Bloom
- CCE1D1
≈ Enchanted
Geteilt komplementär +150° +210°
- D3DAF1
Puffy Cloud
- EBD7C5
≈ Rose Lotion
- D7DFC7
≈ Dream Seascape
Tetradisch +90° +180° +270°
- D3DAF1
Puffy Cloud
- EFD2D9
≈ Light Light Blush
- E2DBC3
≈ Belvedere Cream
- C4E2DC
≈ Tidewater
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.39:1 · APCA Lc 19
Ag
AAAAuf Schwarz
WCAG 15.06:1 · APCA Lc 84
Beste Textfarbe: #000000
WCAG 15.06:1 (AAA) · APCA Lc 84
Contrast pairs
Code-Snippets
CSS
:root {
--puffy-cloud: #d3daf1;
--puffy-cloud-rgb: 211 218 241;
--puffy-cloud-oklch: oklch(0.89 0.032 272.2);
}
.element {
color: var(--puffy-cloud);
background-color: hsl(226 52% 89%);
border-color: oklch(0.89 0.032 272.2);
}Tailwind CSS v4
@theme {
--color-puffy-cloud: #d3daf1;
--color-puffy-cloud-50: #f2f5ff;
--color-puffy-cloud-100: #e4e7f3;
--color-puffy-cloud-200: #d0d4e3;
--color-puffy-cloud-300: #b2b7c9;
--color-puffy-cloud-400: #979eb2;
--color-puffy-cloud-500: #7e859c;
--color-puffy-cloud-600: #6b7184;
--color-puffy-cloud-700: #565a6a;
--color-puffy-cloud-800: #3e424e;
--color-puffy-cloud-900: #2b2e36;
--color-puffy-cloud-950: #181a21;
}SCSS
$puffy-cloud: #d3daf1;
$puffy-cloud-rgb: 211, 218, 241;
$puffy-cloud-light: mix(#fff, $puffy-cloud, 20%);
$puffy-cloud-dark: mix(#000, $puffy-cloud, 20%);
.element {
color: $puffy-cloud;
box-shadow: 0 0 0 2px rgba($puffy-cloud, 0.35);
}