Benannte Farbe · #F6F677
Hyper Beam
Hyper Beam ist #F6F677: rgb(246 246 119), hsl(60 88% 72%), oklch(0.948 0.149 108.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Hyper Beam color name →
#F6F677
oklch(0.948 0.149 108.9)
Farbumrechnungen
- HEX
- #f6f677
- RGB
- rgb(246 246 119)
- HSL
- hsl(60 88% 72%)
- HWB
- hwb(60 47% 4%)
- OKLCH
- oklch(0.948 0.149 108.9)
- OKLab
- oklab(0.948 -0.048 0.141)
- CIE Lab
- lab(95.03 -12.07 60.02)
- LCH
- lch(95.03 61.23 101.4)
- CMYK
- cmyk(0% 0% 52% 4%)
Tints · Shades · Tones
Tints
- F7F788
- F7F897
- F8F9A6
- F9FAB4
- FAFBC1
- FBFCCE
- FCFDDB
- FDFEE7
- FEFEF3
Shades
- D6D667
- B7B757
- 989847
- 7B7B38
- 5F5F2A
- 45451C
- 2C2C10
- 151505
- 030301
Tones
- E9EA7B
- DDDE7D
- D1D280
- C5C681
- B9BA82
- ADAE82
- A2A282
- 969782
- 8B8B81
Farbharmonien
Komplementär +180°
- F6F677
Hyper Beam
- EDECFF
≈ Placebo Purple
Analog -30° +30°
- F6F677
Hyper Beam
- FFEBCC
≈ Blanched Almond
- CCFFBD
≈ Breeze of Green
Triadisch +120° +240°
- F6F677
Hyper Beam
- D9F3FF
≈ Wizard White
- FFE6F1
≈ Cherubic
Geteilt komplementär +150° +210°
- F6F677
Hyper Beam
- E4EFFF
≈ Brilliant White
- FAE6FF
≈ Soft Lavender
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.14:1 · APCA Lc 0
Ag
AAAAuf Schwarz
WCAG 18.36:1 · APCA Lc 98
Beste Textfarbe: #000000
WCAG 18.36:1 (AAA) · APCA Lc 98
Contrast pairs
Code-Snippets
CSS
:root {
--hyper-beam: #f6f677;
--hyper-beam-rgb: 246 246 119;
--hyper-beam-oklch: oklch(0.948 0.149 108.9);
}
.element {
color: var(--hyper-beam);
background-color: hsl(60 88% 72%);
border-color: oklch(0.948 0.149 108.9);
}Tailwind CSS v4
@theme {
--color-hyper-beam: #f6f677;
--color-hyper-beam-50: #f6fac9;
--color-hyper-beam-100: #e9edb4;
--color-hyper-beam-200: #d7db8f;
--color-hyper-beam-300: #bbbf5f;
--color-hyper-beam-400: #a6a523;
--color-hyper-beam-500: #8f8c00;
--color-hyper-beam-600: #797700;
--color-hyper-beam-700: #615f00;
--color-hyper-beam-800: #494500;
--color-hyper-beam-900: #333000;
--color-hyper-beam-950: #1e1c00;
}SCSS
$hyper-beam: #f6f677;
$hyper-beam-rgb: 246, 246, 119;
$hyper-beam-light: mix(#fff, $hyper-beam, 20%);
$hyper-beam-dark: mix(#000, $hyper-beam, 20%);
.element {
color: $hyper-beam;
box-shadow: 0 0 0 2px rgba($hyper-beam, 0.35);
}