Color con nombre · #90A58A
Sonoma Sage
Sonoma Sage es #90A58A: rgb(144 165 138), hsl(107 13% 59%), oklch(0.698 0.045 138.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Green mean? → · Sonoma Sage color name →
#90A58A
oklch(0.698 0.045 138.8)
Conversiones de color
- HEX
- #90a58a
- RGB
- rgb(144 165 138)
- HSL
- hsl(107 13% 59%)
- HWB
- hwb(107 54% 35%)
- OKLCH
- oklch(0.698 0.045 138.8)
- OKLab
- oklab(0.698 -0.034 0.03)
- CIE Lab
- lab(65.53 -11.54 11.47)
- LCH
- lch(65.53 16.27 135.2)
- CMYK
- cmyk(13% 0% 16% 35%)
Tintes · Sombras · Tonos
Tintes
- 9BAE95
- A5B6A1
- B0BFAC
- BBC8B7
- C6D1C3
- D1DACF
- DDE3DB
- E8EDE7
- F3F6F3
Sombras
- 7D8F77
- 6A7965
- 576553
- 455142
- 343D32
- 242B22
- 151A14
- 070A07
- 010101
Tonos
- 8EA189
- 8D9E88
- 8B9A87
- 8A9686
- 889285
- 878F84
- 858B83
- 838782
- 828481
Armonías de color
Complementario +180°
- 90A58A
Sonoma Sage
- AA95B0
≈ Enthroned Above
Análogo -30° +30°
- 90A58A
Sonoma Sage
- A0A080
≈ Rigby Ridge
- 83A799
≈ Beckett
Triádico +120° +240°
- 90A58A
Sonoma Sage
- 8D9FBA
≈ Electric Sky
- B99393
≈ Cherry Taupe
Complementario dividido +150° +210°
- 90A58A
Sonoma Sage
- 9C9AB9
≈ Grape Gatsby
- B493A2
≈ Ashberry
Tetrádico +90° +180° +270°
- 90A58A
Sonoma Sage
- 81A4B4
≈ Grauzone
- AA95B0
≈ Enthroned Above
- B69686
≈ Brush
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.64:1 · APCA Lc 52
Ag
AAASobre negro
WCAG 7.93:1 · APCA Lc 50
Mejor color de texto: #000000
WCAG 7.93:1 (AAA) · APCA Lc 50
Contrast pairs
Fragmentos de código
CSS
:root {
--sonoma-sage: #90a58a;
--sonoma-sage-rgb: 144 165 138;
--sonoma-sage-oklch: oklch(0.698 0.045 138.8);
}
.element {
color: var(--sonoma-sage);
background-color: hsl(107 13% 59%);
border-color: oklch(0.698 0.045 138.8);
}Tailwind CSS v4
@theme {
--color-sonoma-sage: #90a58a;
--color-sonoma-sage-50: #eef9ec;
--color-sonoma-sage-100: #e0ecde;
--color-sonoma-sage-200: #cad9c7;
--color-sonoma-sage-300: #abbea8;
--color-sonoma-sage-400: #91a58c;
--color-sonoma-sage-500: #778e71;
--color-sonoma-sage-600: #657860;
--color-sonoma-sage-700: #51604c;
--color-sonoma-sage-800: #3b4637;
--color-sonoma-sage-900: #293125;
--color-sonoma-sage-950: #161d14;
}SCSS
$sonoma-sage: #90a58a;
$sonoma-sage-rgb: 144, 165, 138;
$sonoma-sage-light: mix(#fff, $sonoma-sage, 20%);
$sonoma-sage-dark: mix(#000, $sonoma-sage, 20%);
.element {
color: $sonoma-sage;
box-shadow: 0 0 0 2px rgba($sonoma-sage, 0.35);
}