Najbliższy nazwany kolor · #67A6F5
#67A6F5
Najbliższy nazwany kolor: Fennel Flower
#67A6F5 (rgb(103 166 245), hsl(213 88% 68%), oklch(0.716 0.133 254.8)) jest najbliższy nazwanemu kolorowi Fennel Flower. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#67A6F5
oklch(0.716 0.133 254.8)
Konwersje koloru
- HEX
- #67a6f5
- RGB
- rgb(103 166 245)
- HSL
- hsl(213 88% 68%)
- HWB
- hwb(213 40% 4%)
- OKLCH
- oklch(0.716 0.133 254.8)
- OKLab
- oklab(0.716 -0.035 -0.129)
- CIE Lab
- lab(66.44 -3.26 -46.38)
- LCH
- lch(66.44 46.5 266)
- CMYK
- cmyk(58% 32% 0% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 77AFF7
- 86B8F8
- 95C1FA
- A4CAFB
- B3D3FC
- C2DCFD
- D2E5FE
- E1EEFE
- F0F6FF
Odcienie ciemniejsze
- 5990D5
- 4B7AB6
- 3D6598
- 30517B
- 233E5F
- 172B44
- 0C1A2B
- 040A15
- 000103
Tony
- 6BA3E9
- 6E9FDD
- 719BD2
- 7498C6
- 7694BA
- 7890AF
- 7B8CA3
- 7D8897
- 7E848C
Harmonie kolorów
Komplementarna +180°
- 67A6F5
Fennel Flower
- D49632
≈ Saimin Noodle Soup
Analogowa -30° +30°
- 67A6F5
Fennel Flower
- 11B4E2
≈ Blue Atoll
- 9B96F3
≈ Cobalite
Triada +120° +240°
- 67A6F5
Fennel Flower
- EA7E89
≈ Dimple
- 7EB65D
≈ Palm Tree
Komplementarna rozszczepiona +150° +210°
- 67A6F5
Fennel Flower
- E7865A
≈ Orangevale
- B0A734
≈ Earls Green
Tetrada +90° +180° +270°
- 67A6F5
Fennel Flower
- DD80B7
≈ Middle Purple
- D49632
≈ Saimin Noodle Soup
- 39BD8E
≈ Aztec Jade
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.51:1 · APCA Lc 49
Ag
AAANa czerni
WCAG 8.34:1 · APCA Lc 53
Najlepszy kolor tekstu: #000000
WCAG 8.34:1 (AAA) · APCA Lc 53
Contrast pairs
Fragmenty kodu
CSS
:root {
--fennel-flower: #67a6f5;
--fennel-flower-rgb: 103 166 245;
--fennel-flower-oklch: oklch(0.716 0.133 254.8);
}
.element {
color: var(--fennel-flower);
background-color: hsl(213 88% 68%);
border-color: oklch(0.716 0.133 254.8);
}Tailwind CSS v4
@theme {
--color-fennel-flower: #67a6f5;
--color-fennel-flower-50: #ddf7ff;
--color-fennel-flower-100: #cceaff;
--color-fennel-flower-200: #b0d7ff;
--color-fennel-flower-300: #8bbafb;
--color-fennel-flower-400: #66a1eb;
--color-fennel-flower-500: #4287dc;
--color-fennel-flower-600: #3973ba;
--color-fennel-flower-700: #2d5c95;
--color-fennel-flower-800: #1c446f;
--color-fennel-flower-900: #122f4e;
--color-fennel-flower-950: #051b34;
}SCSS
$fennel-flower: #67a6f5;
$fennel-flower-rgb: 103, 166, 245;
$fennel-flower-light: mix(#fff, $fennel-flower, 20%);
$fennel-flower-dark: mix(#000, $fennel-flower, 20%);
.element {
color: $fennel-flower;
box-shadow: 0 0 0 2px rgba($fennel-flower, 0.35);
}