Color con nombre más cercano · #2A6322
#2A6322
Color con nombre más cercano: Woodland Wonder
#2A6322 (rgb(42 99 34), hsl(113 49% 26%), oklch(0.446 0.114 141.3)) se parece más al color con nombre Woodland Wonder. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#2A6322
oklch(0.446 0.114 141.3)
Conversiones de color
- HEX
- #2a6322
- RGB
- rgb(42 99 34)
- HSL
- hsl(113 49% 26%)
- HWB
- hwb(113 13% 61%)
- OKLCH
- oklch(0.446 0.114 141.3)
- OKLab
- oklab(0.446 -0.089 0.071)
- CIE Lab
- lab(37.04 -29.98 30.05)
- LCH
- lch(37.04 42.45 134.9)
- CMYK
- cmyk(58% 0% 66% 61%)
Tintes · Sombras · Tonos
Tintes
- 407238
- 54814E
- 699063
- 7D9F78
- 92AF8E
- A7BFA4
- BDCFBA
- D3DFD1
- E9EFE8
Sombras
- 23551C
- 1C4716
- 163A11
- 102E0B
- 0A2107
- 051603
- 020B01
- 010300
- 000000
Tonos
- 34662D
- 3E6937
- 466C41
- 4F6F4A
- 577253
- 60755C
- 687865
- 707B6E
- 787D77
Armonías de color
Complementario +180°
- 2A6322
Woodland Wonder
- 703C7A
≈ Eminence
Análogo -30° +30°
- 2A6322
Woodland Wonder
- 575900
≈ Greensboro
- 00634E
≈ Green Paw Paw
Triádico +120° +240°
- 2A6322
Woodland Wonder
- 2E5293
≈ Insignia
- 883537
≈ Tuskgor Fur
Complementario dividido +150° +210°
- 2A6322
Woodland Wonder
- 56468E
≈ Harvest Night
- 81355B
≈ Alfonso Olive
Tetrádico +90° +180° +270°
- 2A6322
Woodland Wonder
- 005C7D
≈ Job’s Tears
- 703C7A
≈ Eminence
- 843D03
≈ Gryphonne Sepia Wash
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 7.22:1 · APCA Lc 85
Ag
FailSobre negro
WCAG 2.90:1 · APCA Lc 17
Mejor color de texto: #FFFFFF
WCAG 7.22:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmentos de código
CSS
:root {
--woodland-wonder: #2a6322;
--woodland-wonder-rgb: 42 99 34;
--woodland-wonder-oklch: oklch(0.446 0.114 141.3);
}
.element {
color: var(--woodland-wonder);
background-color: hsl(113 49% 26%);
border-color: oklch(0.446 0.114 141.3);
}Tailwind CSS v4
@theme {
--color-woodland-wonder: #2a6322;
--color-woodland-wonder-50: #e3fee1;
--color-woodland-wonder-100: #d2f2d0;
--color-woodland-wonder-200: #b8e1b5;
--color-woodland-wonder-300: #95c792;
--color-woodland-wonder-400: #77af6f;
--color-woodland-wonder-500: #58994f;
--color-woodland-wonder-600: #4b8143;
--color-woodland-wonder-700: #3c6735;
--color-woodland-wonder-800: #2c4c24;
--color-woodland-wonder-900: #1e3518;
--color-woodland-wonder-950: #0e2009;
}SCSS
$woodland-wonder: #2a6322;
$woodland-wonder-rgb: 42, 99, 34;
$woodland-wonder-light: mix(#fff, $woodland-wonder, 20%);
$woodland-wonder-dark: mix(#000, $woodland-wonder, 20%);
.element {
color: $woodland-wonder;
box-shadow: 0 0 0 2px rgba($woodland-wonder, 0.35);
}