Dichtstbijzijnde benoemde kleur · #A78FD0
#A78FD0
Dichtstbijzijnde benoemde kleur: Petrified Purple
#A78FD0 (rgb(167 143 208), hsl(262 41% 69%), oklch(0.696 0.097 300.9)) komt het dichtst bij de benoemde kleur Petrified Purple. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#A78FD0
oklch(0.696 0.097 300.9)
Kleurconversies
- HEX
- #a78fd0
- RGB
- rgb(167 143 208)
- HSL
- hsl(262 41% 69%)
- HWB
- hwb(262 56% 18%)
- OKLCH
- oklch(0.696 0.097 300.9)
- OKLab
- oklab(0.696 0.05 -0.083)
- CIE Lab
- lab(63.44 19.14 -30.29)
- LCH
- lch(63.44 35.83 302.3)
- CMYK
- cmyk(20% 31% 0% 18%)
Tinten · Schaduwen · Tonen
Tinten
- AF9AD5
- B8A5DA
- C0B0DF
- C9BBE4
- D2C6E8
- DBD2ED
- E4DDF2
- EDE8F6
- F6F4FB
Schaduwen
- 917CB5
- 7B699A
- 665780
- 524567
- 3E344F
- 2C2439
- 1A1523
- 0A0710
- 010102
Tonen
- A38EC8
- 9F8CC0
- 9B8BB8
- 978AB0
- 9388A8
- 8F87A0
- 8B8598
- 888390
- 848288
Kleurharmonieën
Complementair +180°
- A78FD0
Petrified Purple
- 94A660
≈ Zesty Apple
Analoog -30° +30°
- A78FD0
Petrified Purple
- 879ADA
≈ Portage
- C087B9
≈ Dragonflies
Triadisch +120° +240°
- A78FD0
Petrified Purple
- C98F5D
≈ Orange Pekoe
- 4DB1A0
≈ Water Park
Gesplitst complementair +150° +210°
- A78FD0
Petrified Purple
- B49B52
≈ Viva Las Vegas
- 6FAE7E
≈ Morning Forest
Tetradisch +90° +180° +270°
- A78FD0
Petrified Purple
- D28678
≈ Zanci
- 94A660
≈ Zesty Apple
- 47ADBF
≈ Verditer Blue
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.80:1 · APCA Lc 54
Ag
AAAOp zwart
WCAG 7.48:1 · APCA Lc 48
Beste tekstkleur: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Codefragmenten
CSS
:root {
--petrified-purple: #a78fd0;
--petrified-purple-rgb: 167 143 208;
--petrified-purple-oklch: oklch(0.696 0.097 300.9);
}
.element {
color: var(--petrified-purple);
background-color: hsl(262 41% 69%);
border-color: oklch(0.696 0.097 300.9);
}Tailwind CSS v4
@theme {
--color-petrified-purple: #a78fd0;
--color-petrified-purple-50: #faefff;
--color-petrified-purple-100: #eee1ff;
--color-petrified-purple-200: #dccbf7;
--color-petrified-purple-300: #c1ace1;
--color-petrified-purple-400: #a891cf;
--color-petrified-purple-500: #9176bc;
--color-petrified-purple-600: #7b649f;
--color-petrified-purple-700: #625080;
--color-petrified-purple-800: #473b5f;
--color-petrified-purple-900: #312843;
--color-petrified-purple-950: #1d162b;
}SCSS
$petrified-purple: #a78fd0;
$petrified-purple-rgb: 167, 143, 208;
$petrified-purple-light: mix(#fff, $petrified-purple, 20%);
$petrified-purple-dark: mix(#000, $petrified-purple, 20%);
.element {
color: $petrified-purple;
box-shadow: 0 0 0 2px rgba($petrified-purple, 0.35);
}