Nazwany kolor · #3366FF
Gentian Flower
Gentian Flower to #3366FF: rgb(51 102 255), hsl(225 100% 60%), oklch(0.573 0.234 265.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Blue mean? → · Gentian Flower color name →
#3366FF
oklch(0.573 0.234 265.3)
Konwersje koloru
- HEX
- #3366ff
- RGB
- rgb(51 102 255)
- HSL
- hsl(225 100% 60%)
- HWB
- hwb(225 20% 0%)
- OKLCH
- oklch(0.573 0.234 265.3)
- OKLab
- oklab(0.573 -0.019 -0.233)
- CIE Lab
- lab(47.4 26.93 -82.47)
- LCH
- lch(47.4 86.76 288.1)
- CMYK
- cmyk(80% 60% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 4678FF
- 5989FF
- 6D99FF
- 81A9FF
- 95B8FF
- AAC6FF
- BFD5FF
- D4E3FF
- E9F1FF
Odcienie ciemniejsze
- 2B58DE
- 234ABE
- 1C3C9E
- 142F80
- 0D2363
- 071748
- 030C2E
- 010416
- 000003
Tony
- 3B6BF3
- 4370E7
- 4B74DA
- 5277CE
- 5A79C2
- 627CB5
- 6A7DA8
- 717F9B
- 797F8E
Harmonie kolorów
Komplementarna +180°
- 3366FF
Gentian Flower
- 977200
≈ Sandy Taupe
Analogowa -30° +30°
- 3366FF
Gentian Flower
- 0082B5
≈ Primal Blue
- 8849EF
≈ Pericallis Hybrida
Triada +120° +240°
- 3366FF
Gentian Flower
- E10023
≈ Cadmium Red
- 009228
≈ Yushan Green
Komplementarna rozszczepiona +150° +210°
- 3366FF
Gentian Flower
- B55D00
≈ Orangish Brown
- 768000
≈ Verde Tropa
Tetrada +90° +180° +270°
- 3366FF
Gentian Flower
- D6037E
≈ Vivid Cerise
- 977200
≈ Sandy Taupe
- 008C75
≈ Emerald Enchantment
Kontrast i dostępność
Ag
AANa bieli
WCAG 4.68:1 · APCA Lc 72
Ag
FailNa czerni
WCAG 4.48:1 · APCA Lc 30
Najlepszy kolor tekstu: #FFFFFF
WCAG 4.68:1 (AA) · APCA Lc 72
Contrast pairs
Fragmenty kodu
CSS
:root {
--gentian-flower: #3366ff;
--gentian-flower-rgb: 51 102 255;
--gentian-flower-oklch: oklch(0.573 0.234 265.3);
}
.element {
color: var(--gentian-flower);
background-color: hsl(225 100% 60%);
border-color: oklch(0.573 0.234 265.3);
}Tailwind CSS v4
@theme {
--color-gentian-flower: #3366ff;
--color-gentian-flower-50: #d7f4ff;
--color-gentian-flower-100: #c5e6ff;
--color-gentian-flower-200: #a8d0ff;
--color-gentian-flower-300: #82afff;
--color-gentian-flower-400: #5a92ff;
--color-gentian-flower-500: #3971ff;
--color-gentian-flower-600: #3161f0;
--color-gentian-flower-700: #264ec2;
--color-gentian-flower-800: #133991;
--color-gentian-flower-900: #0c2767;
--color-gentian-flower-950: #021448;
}SCSS
$gentian-flower: #3366ff;
$gentian-flower-rgb: 51, 102, 255;
$gentian-flower-light: mix(#fff, $gentian-flower, 20%);
$gentian-flower-dark: mix(#000, $gentian-flower, 20%);
.element {
color: $gentian-flower;
box-shadow: 0 0 0 2px rgba($gentian-flower, 0.35);
}