Cor nomeada · #7782A3
Positively Purple
Positively Purple é #7782A3: rgb(119 130 163), hsl(225 19% 55%), oklch(0.61 0.052 270.4). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Positively Purple color name →
#7782A3
oklch(0.61 0.052 270.4)
Conversões de cor
- HEX
- #7782a3
- RGB
- rgb(119 130 163)
- HSL
- hsl(225 19% 55%)
- HWB
- hwb(225 47% 36%)
- OKLCH
- oklch(0.61 0.052 270.4)
- OKLab
- oklab(0.61 0 -0.052)
- CIE Lab
- lab(54.37 1.64 -19.12)
- LCH
- lch(54.37 19.19 274.9)
- CMYK
- cmyk(27% 20% 0% 36%)
Tons claros · Sombras · Tons
Tons claros
- 848EAC
- 919AB5
- 9EA6BE
- ABB2C7
- B9BFD1
- C6CBDA
- D4D8E3
- E2E5EC
- F1F2F6
Sombras
- 67708D
- 575F78
- 474E63
- 383E4F
- 2A2F3C
- 1C202A
- 101219
- 05060A
- 010101
Tons
- 7882A0
- 79829C
- 7A8299
- 7B8195
- 7B8192
- 7C818E
- 7D818B
- 7E8187
- 7F8084
Harmonias de cor
Complementar +180°
- 7782A3
Positively Purple
- 8F825F
≈ Gingko Tree
Análoga -30° +30°
- 7782A3
Positively Purple
- 6788A0
≈ Sporty Blue
- 887C9E
≈ Second Pour
Tríade +120° +240°
- 7782A3
Positively Purple
- A07871
≈ Burlwood
- 6D8C73
≈ Laurel
Complementar dividida +150° +210°
- 7782A3
Positively Purple
- 9B7C64
≈ Tiger’s Eye
- 7F8865
≈ Green Bush
Tétrade +90° +180° +270°
- 7782A3
Positively Purple
- 9E7681
≈ Nostalgia Rose
- 8F825F
≈ Gingko Tree
- 608E84
≈ Chlorite
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.81:1 · APCA Lc 66
Ag
AASobre preto
WCAG 5.50:1 · APCA Lc 36
Melhor cor de texto: #000000
WCAG 5.50:1 (AA) · APCA Lc 36
Contrast pairs
Trechos de código
CSS
:root {
--positively-purple: #7782a3;
--positively-purple-rgb: 119 130 163;
--positively-purple-oklch: oklch(0.61 0.052 270.4);
}
.element {
color: var(--positively-purple);
background-color: hsl(225 19% 55%);
border-color: oklch(0.61 0.052 270.4);
}Tailwind CSS v4
@theme {
--color-positively-purple: #7782a3;
--color-positively-purple-50: #f0f5ff;
--color-positively-purple-100: #e2e7fa;
--color-positively-purple-200: #ccd3eb;
--color-positively-purple-300: #aeb6d3;
--color-positively-purple-400: #929dbe;
--color-positively-purple-500: #7985a9;
--color-positively-purple-600: #66708f;
--color-positively-purple-700: #525a73;
--color-positively-purple-800: #3b4255;
--color-positively-purple-900: #282d3b;
--color-positively-purple-950: #161a25;
}SCSS
$positively-purple: #7782a3;
$positively-purple-rgb: 119, 130, 163;
$positively-purple-light: mix(#fff, $positively-purple, 20%);
$positively-purple-dark: mix(#000, $positively-purple, 20%);
.element {
color: $positively-purple;
box-shadow: 0 0 0 2px rgba($positively-purple, 0.35);
}