C15567 Hex Code

What Color Is C15567?

The hex code #C15567 produces a soft medium red. It breaks down into RGB channels of 193 red, 85 green, and 103 blue, placing it firmly in the red color family. On the HSL model, it sits at 350° on the color wheel with 47% saturation — giving it a muted quality — and 55% lightness, making it medium. The perceived brightness is 47% (119/255), meaning light text (#ffffff) will provide optimal readability when layered on top.

C15567 Color Values

What Does C15567 Mean in Design?

Red colors evoke passion, energy, urgency, and emotional intensity. As a medium variant with 47% saturation, #C15567 carries a muted energy that makes it suitable for both primary and supporting roles in design systems. In color psychology, red tones are associated with warmth and approachability, making #C15567 ideal for brands that need to project friendliness and enthusiasm.

Where to Use C15567 — Practical Applications

C15567 Color Combinations

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

Similar Colors to C15567

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

Tints and Shades of C15567

A tint is made by mixing #C15567 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.

How to Use C15567 in CSS

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

.element {
    color: #C15567;
    background-color: #C15567;
    border: 2px solid #C15567;
    box-shadow: 0 4px 14px rgba(193, 85, 103, 0.35);
}

/* CSS Custom Property */
:root {
    --color-primary: #C15567;
    --color-primary-light: #D0808D;
    --color-primary-dark: #9A4452;
    --color-primary-rgb: 193, 85, 103;
}

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

/* RGBA with opacity */
.overlay {
    background: rgba(193, 85, 103, 0.15);
}

C15567 in Design Systems

When integrating #C15567 into a design system, define it as a semantic token: --color-red-medium: #C15567;. For WCAG 2.1 AA compliance, pair it with light text (#ffffff) for body text. The lighter tint #D0808D works for subtle surface fills, while the darker shade #9A4452 is ideal for focus rings and active states. In Figma or Sketch, add it to your shared library as Red/Medium so the entire team references the single source of truth.

Accessibility Considerations for C15567

Since #C15567 is a dark color (brightness 47%), use light text (#ffffff or #f0f0f0) for readable contrast that meets WCAG 2.1 AA minimum requirements. Always test with tools like the ColorPickerCode contrast checker before shipping to production.

Frequently Asked Questions About C15567