Color con nombre más cercano · #280A32
#280A32
Color con nombre más cercano: Dark Prom Queen
#280A32 (rgb(40 10 50), hsl(285 67% 12%), oklch(0.218 0.08 316.5)) se parece más al color con nombre Dark Prom Queen. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#280A32
oklch(0.218 0.08 316.5)
Conversiones de color
- HEX
- #280a32
- RGB
- rgb(40 10 50)
- HSL
- hsl(285 67% 12%)
- HWB
- hwb(285 4% 80%)
- OKLCH
- oklch(0.218 0.08 316.5)
- OKLab
- oklab(0.218 0.058 -0.055)
- CIE Lab
- lab(7.98 21.43 -19.62)
- LCH
- lch(7.98 29.05 317.5)
- CMYK
- cmyk(20% 80% 0% 80%)
Tintes · Sombras · Tonos
Tintes
- 3B2044
- 4E3657
- 624C6B
- 77647F
- 8D7C93
- A395A8
- B9AEBD
- D0C9D3
- E7E4E9
Sombras
- 21072A
- 1B0522
- 15031B
- 0F0214
- 09010D
- 040107
- 020003
- 010001
- 000000
Tonos
- 30163A
- 392141
- 412D49
- 4A3851
- 534459
- 5C4F61
- 655B68
- 6E6770
- 777478
Armonías de color
Complementario +180°
- 280A32
Dark Prom Queen
- 0A2000
≈ Yuzu Soy
Análogo -30° +30°
- 280A32
Dark Prom Queen
- 19113C
≈ Midnight Monarch
- 320521
≈ Vienna Roast
Triádico +120° +240°
- 280A32
Dark Prom Queen
- 261700
≈ Cannon Black
- 001F20
≈ Stellar Explorer
Complementario dividido +150° +210°
- 280A32
Dark Prom Queen
- 1D1B00
≈ Noir Mystique
- 002115
≈ Clock Chimes Thirteen
Tetrádico +90° +180° +270°
- 280A32
Dark Prom Queen
- 300F00
≈ Chocolate Melange
- 0A2000
≈ Yuzu Soy
- 001E29
≈ Oxford by Night
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 17.80:1 · APCA Lc 104
Ag
FailSobre negro
WCAG 1.17:1 · APCA Lc 0
Mejor color de texto: #FFFFFF
WCAG 17.80:1 (AAA) · APCA Lc 104
Contrast pairs
Fragmentos de código
CSS
:root {
--dark-prom-queen: #280a32;
--dark-prom-queen-rgb: 40 10 50;
--dark-prom-queen-oklch: oklch(0.218 0.08 316.5);
}
.element {
color: var(--dark-prom-queen);
background-color: hsl(285 67% 12%);
border-color: oklch(0.218 0.08 316.5);
}Tailwind CSS v4
@theme {
--color-dark-prom-queen: #280a32;
--color-dark-prom-queen-50: #ffeeff;
--color-dark-prom-queen-100: #f4e0f9;
--color-dark-prom-queen-200: #e3caeb;
--color-dark-prom-queen-300: #c9abd2;
--color-dark-prom-queen-400: #b190be;
--color-dark-prom-queen-500: #9b76aa;
--color-dark-prom-queen-600: #83648f;
--color-dark-prom-queen-700: #695073;
--color-dark-prom-queen-800: #4d3a56;
--color-dark-prom-queen-900: #35283c;
--color-dark-prom-queen-950: #201626;
}SCSS
$dark-prom-queen: #280a32;
$dark-prom-queen-rgb: 40, 10, 50;
$dark-prom-queen-light: mix(#fff, $dark-prom-queen, 20%);
$dark-prom-queen-dark: mix(#000, $dark-prom-queen, 20%);
.element {
color: $dark-prom-queen;
box-shadow: 0 0 0 2px rgba($dark-prom-queen, 0.35);
}