Nächste benannte Farbe · #DEF2FA
#DEF2FA
Nächste benannte Farbe: On Thin Ice
#DEF2FA (rgb(222 242 250), hsl(197 74% 93%), oklch(0.949 0.024 223.7)) liegt am nächsten an der benannten Farbe On Thin Ice. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#DEF2FA
oklch(0.949 0.024 223.7)
Farbumrechnungen
- HEX
- #def2fa
- RGB
- rgb(222 242 250)
- HSL
- hsl(197 74% 93%)
- HWB
- hwb(197 87% 2%)
- OKLCH
- oklch(0.949 0.024 223.7)
- OKLab
- oklab(0.949 -0.017 -0.016)
- CIE Lab
- lab(94.18 -5.65 -6.23)
- LCH
- lch(94.18 8.41 227.8)
- CMYK
- cmyk(11% 3% 0% 2%)
Tints · Shades · Tones
Tints
- E1F3FB
- E5F5FB
- E8F6FC
- EBF7FC
- EFF9FD
- F2FAFD
- F5FBFE
- F8FCFE
- FCFEFF
Shades
- C1D2D9
- A5B4BA
- 89969B
- 6F797D
- 555E61
- 3D4346
- 262B2D
- 121415
- 020303
Tones
- D4E6ED
- CBDAE0
- C1CED4
- B7C3C7
- AEB7BB
- A5ACAF
- 9BA1A3
- 929697
- 898B8C
Farbharmonien
Komplementär +180°
- DEF2FA
On Thin Ice
- FDE9E2
≈ Chablis
Analog -30° +30°
- DEF2FA
On Thin Ice
- DDF3F3
≈ Bone-Chilling
- E3EFFE
≈ Cotton Boll
Triadisch +120° +240°
- DEF2FA
On Thin Ice
- FAE8F2
≈ Cherry Pearl
- F0EFDD
≈ Glisten Green
Geteilt komplementär +150° +210°
- DEF2FA
On Thin Ice
- FEE8E9
≈ Pink Sparkle
- F8ECDD
≈ Bridal Heath
Tetradisch +90° +180° +270°
- DEF2FA
On Thin Ice
- F4EAFA
≈ Perfume Haze
- FDE9E2
≈ Chablis
- E8F2E2
≈ Dinner Mint
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.15:1 · APCA Lc 0
Ag
AAAAuf Schwarz
WCAG 18.18:1 · APCA Lc 97
Beste Textfarbe: #000000
WCAG 18.18:1 (AAA) · APCA Lc 97
Contrast pairs
Code-Snippets
CSS
:root {
--on-thin-ice: #def2fa;
--on-thin-ice-rgb: 222 242 250;
--on-thin-ice-oklch: oklch(0.949 0.024 223.7);
}
.element {
color: var(--on-thin-ice);
background-color: hsl(197 74% 93%);
border-color: oklch(0.949 0.024 223.7);
}Tailwind CSS v4
@theme {
--color-on-thin-ice: #def2fa;
--color-on-thin-ice-50: #eef7fa;
--color-on-thin-ice-100: #e0eaee;
--color-on-thin-ice-200: #cad7dc;
--color-on-thin-ice-300: #abbac1;
--color-on-thin-ice-400: #90a2a9;
--color-on-thin-ice-500: #768a92;
--color-on-thin-ice-600: #64757b;
--color-on-thin-ice-700: #505d63;
--color-on-thin-ice-800: #3a4448;
--color-on-thin-ice-900: #282f32;
--color-on-thin-ice-950: #161c1e;
}SCSS
$on-thin-ice: #def2fa;
$on-thin-ice-rgb: 222, 242, 250;
$on-thin-ice-light: mix(#fff, $on-thin-ice, 20%);
$on-thin-ice-dark: mix(#000, $on-thin-ice, 20%);
.element {
color: $on-thin-ice;
box-shadow: 0 0 0 2px rgba($on-thin-ice, 0.35);
}