En yakın adlandırılmış renk · #00BCFA
#00BCFA
En yakın adlandırılmış renk: Tractor Beam
#00BCFA (rgb(0 188 250), hsl(195 100% 49%), oklch(0.746 0.151 231.2)) en çok Tractor Beam adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#00BCFA
oklch(0.746 0.151 231.2)
Renk dönüşümleri
- HEX
- #00bcfa
- RGB
- rgb(0 188 250)
- HSL
- hsl(195 100% 49%)
- HWB
- hwb(195 0% 2%)
- OKLCH
- oklch(0.746 0.151 231.2)
- OKLab
- oklab(0.746 -0.094 -0.117)
- CIE Lab
- lab(70.76 -24.09 -42.54)
- LCH
- lch(70.76 48.88 240.5)
- CMYK
- cmyk(100% 25% 0% 2%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 41C3FB
- 60CAFC
- 78D1FD
- 8ED8FE
- A2DFFE
- B6E6FF
- C9ECFF
- DBF2FF
- EDF9FF
Koyu tonlar
- 00A3D9
- 008BBA
- 00739B
- 005D7D
- 004761
- 003246
- 001F2D
- 000D15
- 000203
Gri tonlar
- 2FB6EE
- 43B0E1
- 51ABD5
- 5BA5C9
- 649FBC
- 6B99B0
- 7293A4
- 778D98
- 7C868C
Renk uyumları
Tamamlayıcı +180°
- 00BCFA
Tractor Beam
- F68E4A
≈ Blaze
Analog -30° +30°
- 00BCFA
Tractor Beam
- 00C4CE
≈ Turquoise Surf
- 7DACFF
≈ Fennel Flower
Üçlü +120° +240°
- 00BCFA
Tractor Beam
- F382B8
≈ Persian Pink
- B1B52C
≈ Lush Bamboo
Bölünmüş tamamlayıcı +150° +210°
- 00BCFA
Tractor Beam
- FE8282
≈ Light Red
- DDA113
≈ Grapefruit Yellow
Dörtlü +90° +180° +270°
- 00BCFA
Tractor Beam
- D88BE6
≈ Bright Lilac
- F68E4A
≈ Blaze
- 73C467
≈ Mantis
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.19:1 · APCA Lc 42
Ag
AAASiyah üzerinde
WCAG 9.57:1 · APCA Lc 60
En iyi metin rengi: #000000
WCAG 9.57:1 (AAA) · APCA Lc 60
Contrast pairs
Kod parçacıkları
CSS
:root {
--tractor-beam: #00bcfa;
--tractor-beam-rgb: 0 188 250;
--tractor-beam-oklch: oklch(0.746 0.151 231.2);
}
.element {
color: var(--tractor-beam);
background-color: hsl(195 100% 49%);
border-color: oklch(0.746 0.151 231.2);
}Tailwind CSS v4
@theme {
--color-tractor-beam: #00bcfa;
--color-tractor-beam-50: #cbfdff;
--color-tractor-beam-100: #b6f1ff;
--color-tractor-beam-200: #91e0ff;
--color-tractor-beam-300: #5dc4f8;
--color-tractor-beam-400: #00ade7;
--color-tractor-beam-500: #0094d7;
--color-tractor-beam-600: #007eb5;
--color-tractor-beam-700: #006591;
--color-tractor-beam-800: #004a6b;
--color-tractor-beam-900: #00344c;
--color-tractor-beam-950: #001f32;
}SCSS
$tractor-beam: #00bcfa;
$tractor-beam-rgb: 0, 188, 250;
$tractor-beam-light: mix(#fff, $tractor-beam, 20%);
$tractor-beam-dark: mix(#000, $tractor-beam, 20%);
.element {
color: $tractor-beam;
box-shadow: 0 0 0 2px rgba($tractor-beam, 0.35);
}