Nazwany kolor · #315886
Award Blue
Award Blue to #315886: rgb(49 88 134), hsl(212 46% 36%), oklch(0.454 0.088 253.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Award Blue color name →
#315886
oklch(0.454 0.088 253.7)
Konwersje koloru
- HEX
- #315886
- RGB
- rgb(49 88 134)
- HSL
- hsl(212 46% 36%)
- HWB
- hwb(212 19% 47%)
- OKLCH
- oklch(0.454 0.088 253.7)
- OKLab
- oklab(0.454 -0.025 -0.084)
- CIE Lab
- lab(36.22 -2.5 -30.39)
- LCH
- lch(36.22 30.49 265.3)
- CMYK
- cmyk(63% 34% 0% 47%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 456892
- 58789E
- 6C88AA
- 8098B6
- 94A9C2
- A9BACE
- BECBDB
- D3DCE7
- E9EDF3
Odcienie ciemniejsze
- 294B74
- 223F62
- 1A3351
- 132840
- 0C1D30
- 061221
- 030913
- 010306
- 000001
Tony
- 395C86
- 426086
- 4A6585
- 526985
- 596D84
- 617184
- 697583
- 717882
- 787C81
Harmonie kolorów
Komplementarna +180°
- 315886
Award Blue
- 734E12
≈ Lucky Brown
Analogowa -30° +30°
- 315886
Award Blue
- 006079
≈ Blue-Collar
- 504F85
≈ Twilight
Triada +120° +240°
- 315886
Award Blue
- 804048
≈ Ruby Lips
- 42612B
≈ Greenhouse
Komplementarna rozszczepiona +150° +210°
- 315886
Award Blue
- 7E452B
≈ Sunbathing Beauty
- 5F5811
≈ Olive Brown
Tetrada +90° +180° +270°
- 315886
Award Blue
- 784163
≈ Purple Drab
- 734E12
≈ Lucky Brown
- 176549
≈ Brunswick
Kontrast i dostępność
Ag
AAANa bieli
WCAG 7.31:1 · APCA Lc 85
Ag
FailNa czerni
WCAG 2.87:1 · APCA Lc 17
Najlepszy kolor tekstu: #FFFFFF
WCAG 7.31:1 (AAA) · APCA Lc 85
Contrast pairs
Fragmenty kodu
CSS
:root {
--award-blue: #315886;
--award-blue-rgb: 49 88 134;
--award-blue-oklch: oklch(0.454 0.088 253.7);
}
.element {
color: var(--award-blue);
background-color: hsl(212 46% 36%);
border-color: oklch(0.454 0.088 253.7);
}Tailwind CSS v4
@theme {
--color-award-blue: #315886;
--color-award-blue-50: #e5f7ff;
--color-award-blue-100: #d5eaff;
--color-award-blue-200: #bcd7fa;
--color-award-blue-300: #9abae4;
--color-award-blue-400: #7aa1d2;
--color-award-blue-500: #5c89bf;
--color-award-blue-600: #4e74a1;
--color-award-blue-700: #3e5d82;
--color-award-blue-800: #2b4460;
--color-award-blue-900: #1d2f43;
--color-award-blue-950: #0d1c2b;
}SCSS
$award-blue: #315886;
$award-blue-rgb: 49, 88, 134;
$award-blue-light: mix(#fff, $award-blue, 20%);
$award-blue-dark: mix(#000, $award-blue, 20%);
.element {
color: $award-blue;
box-shadow: 0 0 0 2px rgba($award-blue, 0.35);
}