What Color Is FACEBB?

The hex code #FACEBB produces a vivid very light orange. It breaks down into RGB channels of 250 red, 206 green, and 187 blue, placing it firmly in the orange color family. On the HSL model, it sits at 18° on the color wheel with 86% saturation — giving it a vibrant quality — and 86% lightness, making it very light. The perceived brightness is 85% (217/255), meaning dark text (#1a1a2e) will provide optimal readability when layered on top.

FACEBB Color Values

FormatValueUsage
HEX#FACEBBCSS, HTML, SVG
RGB250, 206, 187Screens, CSS, JavaScript
HSL18°, 86%, 86%CSS, Design tools
CMYK0%, 18%, 25%, 2%Print, packaging
Brightness85% (217/255)Accessibility checks
FamilyorangeColor classification
TemperaturewarmDesign psychology

What Does FACEBB Mean in Design?

Orange hues suggest creativity, enthusiasm, warmth, and adventure. As a very light variant with 86% saturation, #FACEBB carries a vibrant energy that makes it suitable for both primary and supporting roles in design systems. In color psychology, orange tones are associated with warmth and approachability, making #FACEBB ideal for brands that need to project friendliness and enthusiasm.

Where to Use FACEBB — Practical Applications

Website hero sections — Use #FACEBB as a full-bleed background with dark text (#1a1a2e) overlay text for immediate visual impact on landing pages.
UI card backgrounds — Apply at 15% opacity (rgba(250, 206, 187, 0.15)) for subtle card surfaces that add depth without overwhelming content.
Button accent color — Set as the primary CTA button color with a darker hover state (#C8A596) for clear interactive feedback.
Brand identity systems — Anchor a brand palette with #FACEBB as the primary swatch, using #BDE8FA as the complementary accent.
Data visualization — Use in chart legends and graph bars. Pair with #BDFACF and #CFBDFA for a triadic scheme that maximizes readability.
Social media templates — Create cohesive Instagram stories and LinkedIn banners using #FACEBB backgrounds with white typography overlays.
Email marketing headers — Apply as the top banner gradient from #FACEBB to #FBDACC for eye-catching newsletter designs.
Mobile app theming — Set as the navigation bar and status bar color on both iOS and Android for a consistent, branded mobile experience.

FACEBB Color Combinations

These are mathematically calculated color harmonies based on the 18° hue position of #FACEBB on the color wheel. Use them to build balanced, professional palettes.

Similar Colors to FACEBB

Colors visually close to #FACEBB with subtle variations in hue, saturation, or brightness. Useful for creating gradient transitions, hover states, and layered interface designs.

Tints and Shades of FACEBB

A tint is made by mixing #FACEBB with white (increasing lightness), while a shade is made by mixing with black (decreasing lightness). These variations are essential for creating depth, hierarchy, and interactive states in UI design.

Lighter 75%: #FBDACC
Lighter 50%: #FCE6DD
Lighter 25%: #FEF3EE
Base Color: #FACEBB
Darker 20%: #C8A596
Darker 40%: #967C70
Darker 60%: #64524B

How to Use FACEBB in CSS

Copy-ready CSS code snippets for implementing #FACEBB in your stylesheets. Includes custom properties, gradients, and opacity variants.

.element {
    color: #FACEBB;
    background-color: #FACEBB;
    border: 2px solid #FACEBB;
    box-shadow: 0 4px 14px rgba(250, 206, 187, 0.35);
}

/* CSS Custom Property */
:root {
    --color-primary: #FACEBB;
    --color-primary-light: #FBDACC;
    --color-primary-dark: #C8A596;
    --color-primary-rgb: 250, 206, 187;
}

/* Gradient example */
.gradient-bg {
    background: linear-gradient(135deg, #FACEBB 0%, #FAEEBD 100%);
}

/* RGBA with opacity */
.overlay {
    background: rgba(250, 206, 187, 0.15);
}

FACEBB in Design Systems

When integrating #FACEBB into a design system, define it as a semantic token: --color-orange-very-light: #FACEBB;. For WCAG 2.1 AA compliance, pair it with dark text (#1a1a2e) for body text. The lighter tint #FBDACC works for subtle surface fills, while the darker shade #C8A596 is ideal for focus rings and active states. In Figma or Sketch, add it to your shared library as Orange/Very-Light so the entire team references the single source of truth.

Accessibility Considerations for FACEBB

Since #FACEBB is a light color (brightness 85%), use dark text to meet WCAG 2.1 contrast requirements. A foreground of #1a1a2e on a #FACEBB background will pass AA for normal text and AAA for large text. Always test with tools like the ColorPickerCode contrast checker before shipping to production.

Frequently Asked Questions About FACEBB

What color is #FACEBB?
#FACEBB is a vivid very light orange with RGB(250, 206, 187) and HSL(18°, 86%, 86%). It belongs to the orange family.
What is the RGB value of FACEBB?
RGB(250, 206, 187). Red=250, Green=206, Blue=187. Each channel ranges from 0 to 255.
Is #FACEBB dark or light?
Perceived brightness is 217/255 (85%), classified as very light. Use dark text (#1a1a2e) for body text.
What is the CMYK of FACEBB?
CMYK: 0%, 18%, 25%, 2%. Use this for print reproduction of #FACEBB.
What colors go well with #FACEBB?
Complementary: #BDE8FA. Analogous: #FAEEBD & #FABDC9. Triadic: #BDFACF & #CFBDFA.
How do I use FACEBB in CSS?
color: #FACEBB; for text, background-color: #FACEBB; for backgrounds, border: 2px solid #FACEBB; for borders.
What is the HSL of #FACEBB?
HSL: 18°, 86%, 86%. Hue 18°, saturation 86%, lightness 86%.
Can #FACEBB be used for branding?
Yes. Test in both RGB (screens) and CMYK (print). Pair with #1a1a2e for text. The orange family projects warmth and energy.