Dichtstbijzijnde benoemde kleur · #318730
#318730
Dichtstbijzijnde benoemde kleur: Resplendent Growth
#318730 (rgb(49 135 48), hsl(119 48% 36%), oklch(0.552 0.149 143.1)) komt het dichtst bij de benoemde kleur Resplendent Growth. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#318730
oklch(0.552 0.149 143.1)
Kleurconversies
- HEX
- #318730
- RGB
- rgb(49 135 48)
- HSL
- hsl(119 48% 36%)
- HWB
- hwb(119 19% 47%)
- OKLCH
- oklch(0.552 0.149 143.1)
- OKLab
- oklab(0.552 -0.119 0.089)
- CIE Lab
- lab(49.78 -40.34 37.53)
- LCH
- lch(49.78 55.1 137.1)
- CMYK
- cmyk(64% 0% 64% 47%)
Tinten · Schaduwen · Tonen
Tinten
- 499346
- 5E9F5B
- 73AB6F
- 87B783
- 9BC398
- AECFAC
- C2DBC0
- D6E7D5
- EBF3EA
Schaduwen
- 297528
- 226321
- 1A511A
- 134113
- 0C310C
- 062106
- 031303
- 010601
- 000100
Tonen
- 3C873A
- 468644
- 4F864C
- 578555
- 5F855C
- 668464
- 6D836B
- 738272
- 7A8179
Kleurharmonieën
Complementair +180°
- 318730
Resplendent Growth
- 9A4FA4
≈ Purpureus
Analoog -30° +30°
- 318730
Resplendent Growth
- 737900
≈ Portuguese Green
- 00866C
≈ Celtic Queen
Triadisch +120° +240°
- 318730
Resplendent Growth
- 426EC8
≈ Han Blue
- B94747
≈ Conte Crayon
Gesplitst complementair +150° +210°
- 318730
Resplendent Growth
- 775DC0
≈ Fuchsia Blue
- B1467A
≈ Mystic Maroon
Tetradisch +90° +180° +270°
- 318730
Resplendent Growth
- 007CAA
≈ Benitoite
- 9A4FA4
≈ Purpureus
- AF5600
≈ Tijolo
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 4.52:1 · APCA Lc 71
Ag
AAOp zwart
WCAG 4.63:1 · APCA Lc 31
Beste tekstkleur: #000000
WCAG 4.63:1 (AA) · APCA Lc 31
Contrast pairs
Codefragmenten
CSS
:root {
--resplendent-growth: #318730;
--resplendent-growth-rgb: 49 135 48;
--resplendent-growth-oklch: oklch(0.552 0.149 143.1);
}
.element {
color: var(--resplendent-growth);
background-color: hsl(119 48% 36%);
border-color: oklch(0.552 0.149 143.1);
}Tailwind CSS v4
@theme {
--color-resplendent-growth: #318730;
--color-resplendent-growth-50: #dcffdc;
--color-resplendent-growth-100: #caf6ca;
--color-resplendent-growth-200: #ace6ad;
--color-resplendent-growth-300: #85cc88;
--color-resplendent-growth-400: #65b461;
--color-resplendent-growth-500: #3d9e3c;
--color-resplendent-growth-600: #368534;
--color-resplendent-growth-700: #2b6b29;
--color-resplendent-growth-800: #214e1a;
--color-resplendent-growth-900: #163711;
--color-resplendent-growth-950: #062104;
}SCSS
$resplendent-growth: #318730;
$resplendent-growth-rgb: 49, 135, 48;
$resplendent-growth-light: mix(#fff, $resplendent-growth, 20%);
$resplendent-growth-dark: mix(#000, $resplendent-growth, 20%);
.element {
color: $resplendent-growth;
box-shadow: 0 0 0 2px rgba($resplendent-growth, 0.35);
}