Nächste benannte Farbe · #31A559
#31A559
Nächste benannte Farbe: Devil’s Grass
#31A559 (rgb(49 165 89), hsl(141 54% 42%), oklch(0.64 0.152 150.7)) liegt am nächsten an der benannten Farbe Devil’s Grass. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#31A559
oklch(0.64 0.152 150.7)
Farbumrechnungen
- HEX
- #31a559
- RGB
- rgb(49 165 89)
- HSL
- hsl(141 54% 42%)
- HWB
- hwb(141 19% 35%)
- OKLCH
- oklch(0.64 0.152 150.7)
- OKLab
- oklab(0.64 -0.132 0.074)
- CIE Lab
- lab(60.13 -46.34 29.61)
- LCH
- lch(60.13 54.99 147.4)
- CMYK
- cmyk(70% 0% 46% 35%)
Tints · Shades · Tones
Tints
- 4DAE6A
- 64B77A
- 79C18A
- 8DCA9B
- A1D3AB
- B4DCBC
- C7E4CC
- D9EDDD
- ECF6EE
Shades
- 298F4C
- 227940
- 1A6534
- 135128
- 0C3D1D
- 062B13
- 031A09
- 010A03
- 000100
Tones
- 40A25E
- 4B9E62
- 549B66
- 5C976B
- 64936E
- 6A9072
- 708C76
- 768879
- 7B847D
Farbharmonien
Komplementär +180°
- 31A559
Devil’s Grass
- BF66B6
≈ Mazzy Star
Analog -30° +30°
- 31A559
Devil’s Grass
- 809905
≈ Mossy Woods
- 00A290
≈ Turquish
Triadisch +120° +240°
- 31A559
Devil’s Grass
- 6A84E7
≈ Soft Blue
- D86351
≈ Track and Field
Geteilt komplementär +150° +210°
- 31A559
Devil’s Grass
- 9C73D9
≈ Iridescent Purple
- D35F87
≈ Peppermint Swirl
Tetradisch +90° +180° +270°
- 31A559
Devil’s Grass
- 0095DD
≈ Kahu Blue
- BF66B6
≈ Mazzy Star
- CB7300
≈ Dirty Orange
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.15:1 · APCA Lc 58
Ag
AAAuf Schwarz
WCAG 6.65:1 · APCA Lc 44
Beste Textfarbe: #000000
WCAG 6.65:1 (AA) · APCA Lc 44
Contrast pairs
Code-Snippets
CSS
:root {
--devil-s-grass: #31a559;
--devil-s-grass-rgb: 49 165 89;
--devil-s-grass-oklch: oklch(0.64 0.152 150.7);
}
.element {
color: var(--devil-s-grass);
background-color: hsl(141 54% 42%);
border-color: oklch(0.64 0.152 150.7);
}Tailwind CSS v4
@theme {
--color-devil-s-grass: #31a559;
--color-devil-s-grass-50: #d5ffe1;
--color-devil-s-grass-100: #c2f7d0;
--color-devil-s-grass-200: #a2e8b5;
--color-devil-s-grass-300: #76ce92;
--color-devil-s-grass-400: #4fb76e;
--color-devil-s-grass-500: #04a14d;
--color-devil-s-grass-600: #108842;
--color-devil-s-grass-700: #0e6d34;
--color-devil-s-grass-800: #0e5022;
--color-devil-s-grass-900: #093817;
--color-devil-s-grass-950: #002208;
}SCSS
$devil-s-grass: #31a559;
$devil-s-grass-rgb: 49, 165, 89;
$devil-s-grass-light: mix(#fff, $devil-s-grass, 20%);
$devil-s-grass-dark: mix(#000, $devil-s-grass, 20%);
.element {
color: $devil-s-grass;
box-shadow: 0 0 0 2px rgba($devil-s-grass, 0.35);
}