Color con nombre más cercano · #DE7AB1
#DE7AB1
Color con nombre más cercano: Pink Punk
#DE7AB1 (rgb(222 122 177), hsl(327 60% 67%), oklch(0.707 0.139 347.1)) se parece más al color con nombre Pink Punk. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#DE7AB1
oklch(0.707 0.139 347.1)
Conversiones de color
- HEX
- #de7ab1
- RGB
- rgb(222 122 177)
- HSL
- hsl(327 60% 67%)
- HWB
- hwb(327 48% 13%)
- OKLCH
- oklch(0.707 0.139 347.1)
- OKLab
- oklab(0.707 0.136 -0.031)
- CIE Lab
- lab(64.05 44.59 -11.24)
- LCH
- lch(64.05 45.98 345.8)
- CMYK
- cmyk(0% 45% 20% 13%)
Tintes · Sombras · Tonos
Tintes
- E388B9
- E795C0
- EBA2C8
- EFB0D0
- F2BDD8
- F5CADF
- F8D7E7
- FBE5EF
- FDF2F7
Sombras
- C16999
- A55983
- 89496C
- 6F3A57
- 552B42
- 3D1D2F
- 26101C
- 12050C
- 020101
Tonos
- D57BAC
- CC7DA7
- C37EA2
- BA7E9D
- B07F98
- A78093
- 9E808F
- 94808A
- 8A8085
Armonías de color
Complementario +180°
- DE7AB1
Pink Punk
- 1CBB8E
≈ Mountain Meadow
Análogo -30° +30°
- DE7AB1
Pink Punk
- C383D9
≈ Purception
- EA7981
≈ Siesta Rose
Triádico +120° +240°
- DE7AB1
Pink Punk
- ABA628
≈ Venom
- 00B0E2
≈ Blue Atoll
Complementario dividido +150° +210°
- DE7AB1
Pink Punk
- 75B45A
≈ Palm Tree
- 00B7BA
≈ Cyan Sky
Tetrádico +90° +180° +270°
- DE7AB1
Pink Punk
- D09320
≈ Jackpot
- 1CBB8E
≈ Mountain Meadow
- 65A1F6
≈ Feather Star
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.79:1 · APCA Lc 53
Ag
AAASobre negro
WCAG 7.52:1 · APCA Lc 48
Mejor color de texto: #000000
WCAG 7.52:1 (AAA) · APCA Lc 48
Contrast pairs
Fragmentos de código
CSS
:root {
--pink-punk: #de7ab1;
--pink-punk-rgb: 222 122 177;
--pink-punk-oklch: oklch(0.707 0.139 347.1);
}
.element {
color: var(--pink-punk);
background-color: hsl(327 60% 67%);
border-color: oklch(0.707 0.139 347.1);
}Tailwind CSS v4
@theme {
--color-pink-punk: #de7ab1;
--color-pink-punk-50: #ffe6fb;
--color-pink-punk-100: #ffd6ef;
--color-pink-punk-200: #ffbcde;
--color-pink-punk-300: #ed9ac3;
--color-pink-punk-400: #d97aae;
--color-pink-punk-500: #c65a98;
--color-pink-punk-600: #a74d80;
--color-pink-punk-700: #863e67;
--color-pink-punk-800: #632c4d;
--color-pink-punk-900: #461e36;
--color-pink-punk-950: #2d0d21;
}SCSS
$pink-punk: #de7ab1;
$pink-punk-rgb: 222, 122, 177;
$pink-punk-light: mix(#fff, $pink-punk, 20%);
$pink-punk-dark: mix(#000, $pink-punk, 20%);
.element {
color: $pink-punk;
box-shadow: 0 0 0 2px rgba($pink-punk, 0.35);
}