Color con nombre · #ECCEE5
Sweet Dreams
Sweet Dreams es #ECCEE5: rgb(236 206 229), hsl(314 44% 87%), oklch(0.883 0.045 334). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Pink mean? → · Sweet Dreams color name →
#ECCEE5
oklch(0.883 0.045 334)
Conversiones de color
- HEX
- #eccee5
- RGB
- rgb(236 206 229)
- HSL
- hsl(314 44% 87%)
- HWB
- hwb(314 81% 7%)
- OKLCH
- oklch(0.883 0.045 334)
- OKLab
- oklab(0.883 0.041 -0.02)
- CIE Lab
- lab(85.84 13.73 -7.33)
- LCH
- lch(85.84 15.56 331.9)
- CMYK
- cmyk(0% 13% 3% 7%)
Tintes · Sombras · Tonos
Tintes
- EED3E8
- F0D8EA
- F2DDED
- F4E1EF
- F6E6F2
- F8EBF5
- FAF0F7
- FBF5FA
- FDFAFC
Sombras
- CDB3C7
- AF98AA
- 927F8E
- 766672
- 5B4E58
- 42383F
- 292328
- 130F12
- 030203
Tonos
- E1C6DA
- D6BED0
- CBB6C6
- C0AEBB
- B5A6B1
- AA9EA7
- 9F979D
- 958F93
- 8A888A
Armonías de color
Complementario +180°
- ECCEE5
Sweet Dreams
- C3E2CB
≈ Wishful Green
Análogo -30° +30°
- ECCEE5
Sweet Dreams
- DFD2F1
≈ Japan Blush
- F4CDD5
≈ Lover’s Retreat
Triádico +120° +240°
- ECCEE5
Sweet Dreams
- E2D9B8
≈ Sesame Seed
- B8E1EB
≈ Diminished Blue
Complementario dividido +150° +210°
- ECCEE5
Sweet Dreams
- D2DEBE
≈ Green Parlour
- B8E3DC
≈ Festival de Verano
Tetrádico +90° +180° +270°
- ECCEE5
Sweet Dreams
- EED3BA
≈ Creamery
- C3E2CB
≈ Wishful Green
- C0DDF5
≈ Greek Isles
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.44:1 · APCA Lc 21
Ag
AAASobre negro
WCAG 14.52:1 · APCA Lc 82
Mejor color de texto: #000000
WCAG 14.52:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmentos de código
CSS
:root {
--sweet-dreams: #eccee5;
--sweet-dreams-rgb: 236 206 229;
--sweet-dreams-oklch: oklch(0.883 0.045 334);
}
.element {
color: var(--sweet-dreams);
background-color: hsl(314 44% 87%);
border-color: oklch(0.883 0.045 334);
}Tailwind CSS v4
@theme {
--color-sweet-dreams: #eccee5;
--color-sweet-dreams-50: #fef1fa;
--color-sweet-dreams-100: #f2e2ee;
--color-sweet-dreams-200: #e1cddc;
--color-sweet-dreams-300: #c7afc0;
--color-sweet-dreams-400: #b095aa;
--color-sweet-dreams-500: #997b93;
--color-sweet-dreams-600: #82687c;
--color-sweet-dreams-700: #685363;
--color-sweet-dreams-800: #4c3d49;
--color-sweet-dreams-900: #352a33;
--color-sweet-dreams-950: #20171f;
}SCSS
$sweet-dreams: #eccee5;
$sweet-dreams-rgb: 236, 206, 229;
$sweet-dreams-light: mix(#fff, $sweet-dreams, 20%);
$sweet-dreams-dark: mix(#000, $sweet-dreams, 20%);
.element {
color: $sweet-dreams;
box-shadow: 0 0 0 2px rgba($sweet-dreams, 0.35);
}