Nazwany kolor · #228822
Pettifers
Pettifers to #228822: rgb(34 136 34), hsl(120 60% 33%), oklch(0.549 0.165 142.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Pettifers color name →
#228822
oklch(0.549 0.165 142.9)
Konwersje koloru
- HEX
- #228822
- RGB
- rgb(34 136 34)
- HSL
- hsl(120 60% 33%)
- HWB
- hwb(120 13% 47%)
- OKLCH
- oklch(0.549 0.165 142.9)
- OKLab
- oklab(0.549 -0.132 0.1)
- CIE Lab
- lab(49.62 -44.78 43.03)
- LCH
- lch(49.62 62.1 136.1)
- CMYK
- cmyk(75% 0% 75% 47%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 3F943D
- 57A054
- 6DAC69
- 82B87E
- 97C493
- ACD0A9
- C0DBBE
- D5E7D3
- EAF3E9
Odcienie ciemniejsze
- 1C751C
- 166316
- 115211
- 0B410B
- 073107
- 032203
- 011301
- 000600
- 000100
Tony
- 328830
- 3F873C
- 498746
- 52864F
- 5B8558
- 638561
- 6B8469
- 728371
- 798178
Harmonie kolorów
Komplementarna +180°
- 228822
Pettifers
- 9D49A8
≈ Purpureus
Analogowa -30° +30°
- 228822
Pettifers
- 737800
≈ Portuguese Green
- 00856B
≈ Bosphorus
Triada +120° +240°
- 228822
Pettifers
- 3B6BD0
≈ Han Blue
- BF3E41
≈ Rubiate
Komplementarna rozszczepiona +150° +210°
- 228822
Pettifers
- 7759C7
≈ Fuchsia Blue
- B53E7A
≈ Fuchsia Red
Tetrada +90° +180° +270°
- 228822
Pettifers
- 007BA8
≈ Celadon Blue
- 9D49A8
≈ Purpureus
- AE5500
≈ Tijolo
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.55:1 · APCA Lc 71
Ag
AANa czerni
WCAG 4.61:1 · APCA Lc 31
Najlepszy kolor tekstu: #000000
WCAG 4.61:1 (AA) · APCA Lc 31
Contrast pairs
Fragmenty kodu
CSS
:root {
--pettifers: #228822;
--pettifers-rgb: 34 136 34;
--pettifers-oklch: oklch(0.549 0.165 142.9);
}
.element {
color: var(--pettifers);
background-color: hsl(120 60% 33%);
border-color: oklch(0.549 0.165 142.9);
}Tailwind CSS v4
@theme {
--color-pettifers: #228822;
--color-pettifers-50: #d9ffd8;
--color-pettifers-100: #c6f7c6;
--color-pettifers-200: #a8e7a8;
--color-pettifers-300: #7fce81;
--color-pettifers-400: #5cb659;
--color-pettifers-500: #2fa02e;
--color-pettifers-600: #2a8729;
--color-pettifers-700: #226c21;
--color-pettifers-800: #1b4f12;
--color-pettifers-900: #12370b;
--color-pettifers-950: #042201;
}SCSS
$pettifers: #228822;
$pettifers-rgb: 34, 136, 34;
$pettifers-light: mix(#fff, $pettifers, 20%);
$pettifers-dark: mix(#000, $pettifers, 20%);
.element {
color: $pettifers;
box-shadow: 0 0 0 2px rgba($pettifers, 0.35);
}