Nazwany kolor · #3E7FA5
Cendre Blue
Cendre Blue to #3E7FA5: rgb(62 127 165), hsl(202 45% 45%), oklch(0.57 0.089 236.8). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Cendre Blue color name →
#3E7FA5
oklch(0.57 0.089 236.8)
Konwersje koloru
- HEX
- #3e7fa5
- RGB
- rgb(62 127 165)
- HSL
- hsl(202 45% 45%)
- HWB
- hwb(202 24% 35%)
- OKLCH
- oklch(0.57 0.089 236.8)
- OKLab
- oklab(0.57 -0.048 -0.074)
- CIE Lab
- lab(50.18 -12.46 -27.04)
- LCH
- lch(50.18 29.77 245.3)
- CMYK
- cmyk(62% 23% 0% 35%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 538BAE
- 6698B7
- 79A5C0
- 8CB1C9
- 9FBED2
- B2CBDB
- C5D8E4
- D8E5ED
- EBF2F6
Odcienie ciemniejsze
- 356E8F
- 2B5D79
- 234C65
- 1A3C51
- 122D3D
- 0A1F2B
- 04111A
- 01060A
- 000101
Tony
- 477FA1
- 4E809E
- 56809A
- 5D8097
- 638093
- 69808F
- 6F808C
- 758088
- 7B8084
Harmonie kolorów
Komplementarna +180°
- 3E7FA5
Cendre Blue
- 9F6941
≈ Bottled Ship
Analogowa -30° +30°
- 3E7FA5
Cendre Blue
- 228692
≈ River Fountain
- 6076AC
≈ King’s Robe
Triada +120° +240°
- 3E7FA5
Cendre Blue
- A16178
≈ Cosmetic Red
- 747E3E
≈ Calla Green
Komplementarna rozszczepiona +150° +210°
- 3E7FA5
Cendre Blue
- A5625B
≈ Savannah Red
- 8E7434
≈ Marshy Green
Tetrada +90° +180° +270°
- 3E7FA5
Cendre Blue
- 936493
≈ Tulipan Violet
- 9F6941
≈ Bottled Ship
- 538658
≈ Emerald Ring
Kontrast i dostępność
Ag
FailNa bieli
WCAG 4.38:1 · APCA Lc 70
Ag
AANa czerni
WCAG 4.78:1 · APCA Lc 31
Najlepszy kolor tekstu: #000000
WCAG 4.78:1 (AA) · APCA Lc 31
Contrast pairs
Fragmenty kodu
CSS
:root {
--cendre-blue: #3e7fa5;
--cendre-blue-rgb: 62 127 165;
--cendre-blue-oklch: oklch(0.57 0.089 236.8);
}
.element {
color: var(--cendre-blue);
background-color: hsl(202 45% 45%);
border-color: oklch(0.57 0.089 236.8);
}Tailwind CSS v4
@theme {
--color-cendre-blue: #3e7fa5;
--color-cendre-blue-50: #dff9ff;
--color-cendre-blue-100: #ceedff;
--color-cendre-blue-200: #b2daf6;
--color-cendre-blue-300: #8dbee0;
--color-cendre-blue-400: #69a7cc;
--color-cendre-blue-500: #458fb9;
--color-cendre-blue-600: #3c799c;
--color-cendre-blue-700: #30617e;
--color-cendre-blue-800: #20475d;
--color-cendre-blue-900: #153141;
--color-cendre-blue-950: #061d29;
}SCSS
$cendre-blue: #3e7fa5;
$cendre-blue-rgb: 62, 127, 165;
$cendre-blue-light: mix(#fff, $cendre-blue, 20%);
$cendre-blue-dark: mix(#000, $cendre-blue, 20%);
.element {
color: $cendre-blue;
box-shadow: 0 0 0 2px rgba($cendre-blue, 0.35);
}