Adlandırılmış renk · #828F72
Battleship Green
Battleship Green, #828F72: rgb(130 143 114), hsl(87 11% 50%), oklch(0.631 0.045 127.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Green mean? → · Battleship Green color name →
#828F72
oklch(0.631 0.045 127.3)
Renk dönüşümleri
- HEX
- #828f72
- RGB
- rgb(130 143 114)
- HSL
- hsl(87 11% 50%)
- HWB
- hwb(87 45% 44%)
- OKLCH
- oklch(0.631 0.045 127.3)
- OKLab
- oklab(0.631 -0.027 0.036)
- CIE Lab
- lab(57.73 -8.98 13.84)
- LCH
- lch(57.73 16.5 123)
- CMYK
- cmyk(9% 0% 20% 44%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 8E9A7F
- 9AA58D
- A6AF9B
- B2BAA8
- BFC6B6
- CBD1C5
- D8DCD3
- E5E8E1
- F2F3F0
Koyu tonlar
- 707C62
- 5F6953
- 4E5744
- 3E4536
- 2F3428
- 20241B
- 12150E
- 060704
- 010101
Gri tonlar
- 828E74
- 828C75
- 818B76
- 818978
- 818879
- 81867B
- 81857C
- 80837D
- 80827F
Renk uyumları
Tamamlayıcı +180°
- 828F72
Battleship Green
- 91839F
≈ Fabulous Grape
Analog -30° +30°
- 828F72
Battleship Green
- 918A6B
≈ Knapsack
- 74927F
≈ Rainford
Üçlü +120° +240°
- 828F72
Battleship Green
- 748DA4
≈ Blue Grey
- A27F85
≈ Plumville
Bölünmüş tamamlayıcı +150° +210°
- 828F72
Battleship Green
- 8288A5
≈ Violet Aura
- 9C8093
≈ Garden Plum
Dörtlü +90° +180° +270°
- 828F72
Battleship Green
- 6B919B
≈ Secret Cove
- 91839F
≈ Fabulous Grape
- A28176
≈ Clay Dusk
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.43:1 · APCA Lc 62
Ag
AASiyah üzerinde
WCAG 6.12:1 · APCA Lc 40
En iyi metin rengi: #000000
WCAG 6.12:1 (AA) · APCA Lc 40
Contrast pairs
Kod parçacıkları
CSS
:root {
--battleship-green: #828f72;
--battleship-green-rgb: 130 143 114;
--battleship-green-oklch: oklch(0.631 0.045 127.3);
}
.element {
color: var(--battleship-green);
background-color: hsl(87 11% 50%);
border-color: oklch(0.631 0.045 127.3);
}Tailwind CSS v4
@theme {
--color-battleship-green: #828f72;
--color-battleship-green-50: #f1f8eb;
--color-battleship-green-100: #e3ebdc;
--color-battleship-green-200: #ced8c4;
--color-battleship-green-300: #b0bca4;
--color-battleship-green-400: #97a488;
--color-battleship-green-500: #7e8c6c;
--color-battleship-green-600: #6b775c;
--color-battleship-green-700: #555f49;
--color-battleship-green-800: #3f4534;
--color-battleship-green-900: #2b3024;
--color-battleship-green-950: #181c13;
}SCSS
$battleship-green: #828f72;
$battleship-green-rgb: 130, 143, 114;
$battleship-green-light: mix(#fff, $battleship-green, 20%);
$battleship-green-dark: mix(#000, $battleship-green, 20%);
.element {
color: $battleship-green;
box-shadow: 0 0 0 2px rgba($battleship-green, 0.35);
}