Adlandırılmış renk · #BB5588
Berry Boost
Berry Boost, #BB5588: rgb(187 85 136), hsl(330 43% 53%), oklch(0.592 0.143 351.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Red mean? → · Berry Boost color name →
#BB5588
oklch(0.592 0.143 351.1)
Renk dönüşümleri
- HEX
- #bb5588
- RGB
- rgb(187 85 136)
- HSL
- hsl(330 43% 53%)
- HWB
- hwb(330 33% 27%)
- OKLCH
- oklch(0.592 0.143 351.1)
- OKLab
- oklab(0.592 0.141 -0.022)
- CIE Lab
- lab(50.76 46.04 -7.82)
- LCH
- lch(50.76 46.7 350.4)
- CMYK
- cmyk(0% 55% 27% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C36793
- CB789F
- D388AA
- DA99B6
- E1AAC2
- E8BBCE
- EECCDA
- F4DDE6
- FAEEF3
Koyu tonlar
- A24975
- 8A3D63
- 733152
- 5C2641
- 461C31
- 321122
- 1F0813
- 0D0206
- 020001
Gri tonlar
- B65B87
- B16086
- AC6586
- A66985
- A06D84
- 9B7183
- 947582
- 8E7982
- 877D81
Renk uyumları
Tamamlayıcı +180°
- BB5588
Berry Boost
- 009475
≈ Pool Table
Analog -30° +30°
- BB5588
Berry Boost
- A45EB1
≈ Prickly Purple
- C45557
≈ Chrysanthemum
Üçlü +120° +240°
- BB5588
Berry Boost
- 828400
≈ Drably Olive
- 0089B8
≈ Mermaid Dreams
Bölünmüş tamamlayıcı +150° +210°
- BB5588
Berry Boost
- 47923C
≈ May Green
- 008F96
≈ Christina Brown
Dörtlü +90° +180° +270°
- BB5588
Berry Boost
- A27500
≈ Barbarian Leather
- 009475
≈ Pool Table
- 4B7BD2
≈ Serenity’s Reign
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 4.40:1 · APCA Lc 70
Ag
AASiyah üzerinde
WCAG 4.76:1 · APCA Lc 32
En iyi metin rengi: #000000
WCAG 4.76:1 (AA) · APCA Lc 32
Contrast pairs
Kod parçacıkları
CSS
:root {
--berry-boost: #bb5588;
--berry-boost-rgb: 187 85 136;
--berry-boost-oklch: oklch(0.592 0.143 351.1);
}
.element {
color: var(--berry-boost);
background-color: hsl(330 43% 53%);
border-color: oklch(0.592 0.143 351.1);
}Tailwind CSS v4
@theme {
--color-berry-boost: #bb5588;
--color-berry-boost-50: #ffe5f9;
--color-berry-boost-100: #ffd5ec;
--color-berry-boost-200: #ffbbd9;
--color-berry-boost-300: #f098be;
--color-berry-boost-400: #dd79a9;
--color-berry-boost-500: #ca5891;
--color-berry-boost-600: #aa4b7b;
--color-berry-boost-700: #893c62;
--color-berry-boost-800: #652b4a;
--color-berry-boost-900: #471d33;
--color-berry-boost-950: #2e0c1f;
}SCSS
$berry-boost: #bb5588;
$berry-boost-rgb: 187, 85, 136;
$berry-boost-light: mix(#fff, $berry-boost, 20%);
$berry-boost-dark: mix(#000, $berry-boost, 20%);
.element {
color: $berry-boost;
box-shadow: 0 0 0 2px rgba($berry-boost, 0.35);
}