7D4039 Hex Code

What Color Is 7D4039?

The hex code #7D4039 produces a soft dark red. It breaks down into RGB channels of 125 red, 64 green, and 57 blue, placing it firmly in the red color family. On the HSL model, it sits at 6° on the color wheel with 37% saturation — giving it a muted quality — and 36% lightness, making it dark. The perceived brightness is 32% (81/255), meaning light text (#ffffff) will provide optimal readability when layered on top.

7D4039 Color Values

What Does 7D4039 Mean in Design?

Red colors evoke passion, energy, urgency, and emotional intensity. As a dark variant with 37% saturation, #7D4039 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 #7D4039 ideal for brands that need to project friendliness and enthusiasm.

Where to Use 7D4039 — Practical Applications

7D4039 Color Combinations

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

Similar Colors to 7D4039

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

Tints and Shades of 7D4039

A tint is made by mixing #7D4039 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 7D4039 in CSS

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

.element {
    color: #7D4039;
    background-color: #7D4039;
    border: 2px solid #7D4039;
    box-shadow: 0 4px 14px rgba(125, 64, 57, 0.35);
}

/* CSS Custom Property */
:root {
    --color-primary: #7D4039;
    --color-primary-light: #9E706A;
    --color-primary-dark: #64332E;
    --color-primary-rgb: 125, 64, 57;
}

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

/* RGBA with opacity */
.overlay {
    background: rgba(125, 64, 57, 0.15);
}

7D4039 in Design Systems

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

Accessibility Considerations for 7D4039

Since #7D4039 is a dark color (brightness 32%), 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 7D4039