Nazwany kolor · #7F95A5
Storm Petrel
Storm Petrel to #7F95A5: rgb(127 149 165), hsl(205 17% 57%), oklch(0.658 0.035 239.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Storm Petrel color name →
#7F95A5
oklch(0.658 0.035 239.7)
Konwersje koloru
- HEX
- #7f95a5
- RGB
- rgb(127 149 165)
- HSL
- hsl(205 17% 57%)
- HWB
- hwb(205 50% 35%)
- OKLCH
- oklch(0.658 0.035 239.7)
- OKLab
- oklab(0.658 -0.017 -0.03)
- CIE Lab
- lab(60.38 -5.33 -11.19)
- LCH
- lch(60.38 12.39 244.5)
- CMYK
- cmyk(23% 10% 0% 35%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8B9FAE
- 98A9B7
- A4B4BF
- B1BEC8
- BDC9D1
- CAD3DA
- D7DEE3
- E4E9ED
- F2F4F6
Odcienie ciemniejsze
- 6E818F
- 5D6D79
- 4C5A65
- 3C4851
- 2D373D
- 1F262B
- 11161A
- 06080A
- 010101
Tony
- 7F93A1
- 7F919E
- 808F9A
- 808D96
- 808B92
- 80888F
- 80868B
- 808487
- 808284
Harmonie kolorów
Komplementarna +180°
- 7F95A5
Storm Petrel
- A28D7D
≈ Cocoa Whip
Analogowa -30° +30°
- 7F95A5
Storm Petrel
- 7A989D
≈ Cathedral Glass
- 8991A8
≈ Dusty Heather
Triada +120° +240°
- 7F95A5
Storm Petrel
- A48991
≈ Gothic Amethyst
- 8F957E
≈ Veranda Green
Komplementarna rozszczepiona +150° +210°
- 7F95A5
Storm Petrel
- A68A85
≈ Forest Trail
- 9A917A
≈ Grassy Savannah
Tetrada +90° +180° +270°
- 7F95A5
Storm Petrel
- 9E8A9C
≈ Merlin’s Choice
- A28D7D
≈ Cocoa Whip
- 839887
≈ Paradise Found
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.11:1 · APCA Lc 58
Ag
AANa czerni
WCAG 6.74:1 · APCA Lc 44
Najlepszy kolor tekstu: #000000
WCAG 6.74:1 (AA) · APCA Lc 44
Contrast pairs
Fragmenty kodu
CSS
:root {
--storm-petrel: #7f95a5;
--storm-petrel-rgb: 127 149 165;
--storm-petrel-oklch: oklch(0.658 0.035 239.7);
}
.element {
color: var(--storm-petrel);
background-color: hsl(205 17% 57%);
border-color: oklch(0.658 0.035 239.7);
}Tailwind CSS v4
@theme {
--color-storm-petrel: #7f95a5;
--color-storm-petrel-50: #edf7fe;
--color-storm-petrel-100: #deeaf3;
--color-storm-petrel-200: #c8d6e2;
--color-storm-petrel-300: #a9bac8;
--color-storm-petrel-400: #8da2b1;
--color-storm-petrel-500: #728a9b;
--color-storm-petrel-600: #607583;
--color-storm-petrel-700: #4d5d69;
--color-storm-petrel-800: #37444d;
--color-storm-petrel-900: #262f36;
--color-storm-petrel-950: #141c21;
}SCSS
$storm-petrel: #7f95a5;
$storm-petrel-rgb: 127, 149, 165;
$storm-petrel-light: mix(#fff, $storm-petrel, 20%);
$storm-petrel-dark: mix(#000, $storm-petrel, 20%);
.element {
color: $storm-petrel;
box-shadow: 0 0 0 2px rgba($storm-petrel, 0.35);
}