Nazwany kolor · #A2C7A3
French Market
French Market to #A2C7A3: rgb(162 199 163), hsl(122 25% 71%), oklch(0.793 0.064 145.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · French Market color name →
#A2C7A3
oklch(0.793 0.064 145.6)
Konwersje koloru
- HEX
- #a2c7a3
- RGB
- rgb(162 199 163)
- HSL
- hsl(122 25% 71%)
- HWB
- hwb(122 64% 22%)
- OKLCH
- oklch(0.793 0.064 145.6)
- OKLab
- oklab(0.793 -0.053 0.036)
- CIE Lab
- lab(76.8 -18.03 13.85)
- LCH
- lch(76.8 22.74 142.5)
- CMYK
- cmyk(19% 0% 18% 22%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- ABCDAC
- B4D2B5
- BED8BE
- C7DDC7
- D0E3D0
- D9E9DA
- E3EEE3
- ECF4EC
- F6F9F6
Odcienie ciemniejsze
- 8CAD8D
- 779378
- 637A63
- 4F624F
- 3C4C3C
- 2A362A
- 192119
- 0A0E0A
- 010201
Tony
- 9FC0A0
- 9BB89C
- 98B199
- 95AA95
- 91A392
- 8E9C8E
- 8A958B
- 878E87
- 848784
Harmonie kolorów
Komplementarna +180°
- A2C7A3
French Market
- D1AED2
≈ Plink
Analogowa -30° +30°
- A2C7A3
French Market
- B9C192
≈ Jitterbug
- 90C9BA
≈ Beach Breeze
Triada +120° +240°
- A2C7A3
French Market
- A8BBE6
≈ French Lilac Blue
- E2ACA6
≈ Coral Fountain
Komplementarna rozszczepiona +150° +210°
- A2C7A3
French Market
- BEB4E1
≈ Moonraker
- DEABBD
≈ Apple Infusion
Tetrada +90° +180° +270°
- A2C7A3
French Market
- 94C3DF
≈ Caribbean Coast
- D1AED2
≈ Plink
- DCB194
≈ Sunset Cove
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.86:1 · APCA Lc 35
Ag
AAANa czerni
WCAG 11.23:1 · APCA Lc 67
Najlepszy kolor tekstu: #000000
WCAG 11.23:1 (AAA) · APCA Lc 67
Contrast pairs
Fragmenty kodu
CSS
:root {
--french-market: #a2c7a3;
--french-market-rgb: 162 199 163;
--french-market-oklch: oklch(0.793 0.064 145.6);
}
.element {
color: var(--french-market);
background-color: hsl(122 25% 71%);
border-color: oklch(0.793 0.064 145.6);
}Tailwind CSS v4
@theme {
--color-french-market: #a2c7a3;
--color-french-market-50: #eafbeb;
--color-french-market-100: #daeedc;
--color-french-market-200: #c3dcc5;
--color-french-market-300: #a2c1a5;
--color-french-market-400: #87a988;
--color-french-market-500: #6b926c;
--color-french-market-600: #5b7b5c;
--color-french-market-700: #486349;
--color-french-market-800: #354834;
--color-french-market-900: #243224;
--color-french-market-950: #131e12;
}SCSS
$french-market: #a2c7a3;
$french-market-rgb: 162, 199, 163;
$french-market-light: mix(#fff, $french-market, 20%);
$french-market-dark: mix(#000, $french-market, 20%);
.element {
color: $french-market;
box-shadow: 0 0 0 2px rgba($french-market, 0.35);
}