Benoemde kleur · #B8A4C8
Violet Fields
Violet Fields is #B8A4C8: rgb(184 164 200), hsl(273 25% 71%), oklch(0.748 0.055 310). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Purple mean? → · Violet Fields color name →
#B8A4C8
oklch(0.748 0.055 310)
Kleurconversies
- HEX
- #b8a4c8
- RGB
- rgb(184 164 200)
- HSL
- hsl(273 25% 71%)
- HWB
- hwb(273 64% 22%)
- OKLCH
- oklch(0.748 0.055 310)
- OKLab
- oklab(0.748 0.036 -0.042)
- CIE Lab
- lab(70.02 12.58 -15.72)
- LCH
- lch(70.02 20.13 308.7)
- CMYK
- cmyk(8% 18% 0% 22%)
Tinten · Schaduwen · Tonen
Tinten
- BFADCE
- C6B6D3
- CDBFD9
- D4C8DE
- DBD1E4
- E2DAE9
- E9E3EF
- F0ECF4
- F8F6FA
Schaduwen
- A08EAE
- 887994
- 71647B
- 5B5063
- 453D4C
- 312B36
- 1E1A21
- 0C0A0F
- 020102
Tonen
- B2A0C1
- AD9DB9
- A799B2
- A196AB
- 9C92A4
- 968E9C
- 908B95
- 8B878E
- 858487
Kleurharmonieën
Complementair +180°
- B8A4C8
Violet Fields
- A2B590
≈ Haven
Analoog -30° +30°
- B8A4C8
Violet Fields
- A6AAD0
≈ Melody Purple
- C6A0B8
≈ Idyllic Pink
Triadisch +120° +240°
- B8A4C8
Violet Fields
- C4A888
≈ Toasted Grain
- 84B9B5
≈ Vintage Blue
Gesplitst complementair +150° +210°
- B8A4C8
Violet Fields
- B5AF86
≈ Lively Ivy
- 8FB9A1
≈ Greyed Jade
Tetradisch +90° +180° +270°
- B8A4C8
Violet Fields
- CDA293
≈ Cashmere Clay
- A2B590
≈ Haven
- 86B6C6
≈ Crystal Lake
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.28:1 · APCA Lc 45
Ag
AAAOp zwart
WCAG 9.18:1 · APCA Lc 57
Beste tekstkleur: #000000
WCAG 9.18:1 (AAA) · APCA Lc 57
Contrast pairs
Codefragmenten
CSS
:root {
--violet-fields: #b8a4c8;
--violet-fields-rgb: 184 164 200;
--violet-fields-oklch: oklch(0.748 0.055 310);
}
.element {
color: var(--violet-fields);
background-color: hsl(273 25% 71%);
border-color: oklch(0.748 0.055 310);
}Tailwind CSS v4
@theme {
--color-violet-fields: #b8a4c8;
--color-violet-fields-50: #faf1ff;
--color-violet-fields-100: #eee3f6;
--color-violet-fields-200: #dccee6;
--color-violet-fields-300: #c1b0cc;
--color-violet-fields-400: #a896b7;
--color-violet-fields-500: #917ca2;
--color-violet-fields-600: #7b6989;
--color-violet-fields-700: #62546e;
--color-violet-fields-800: #483d51;
--color-violet-fields-900: #322a39;
--color-violet-fields-950: #1e1823;
}SCSS
$violet-fields: #b8a4c8;
$violet-fields-rgb: 184, 164, 200;
$violet-fields-light: mix(#fff, $violet-fields, 20%);
$violet-fields-dark: mix(#000, $violet-fields, 20%);
.element {
color: $violet-fields;
box-shadow: 0 0 0 2px rgba($violet-fields, 0.35);
}