Palette

Cozy Fireside Reading

Warm, inviting reds and deep browns, evoking the comfort of a cozy evening by a crackling fireside.

warmcalm5 colors

More warm palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cozy Fireside Reading reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Cozy Fireside Reading.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#6B2A1E#9C3B2F#C45F54#4A1E15#8A3A2C

Palette guide

How to use Cozy Fireside Reading

Overview

The Cozy Fireside Reading palette offers a rich, comforting experience with its deep, warm reds and earthy browns. Featuring hues like the robust #6B2A1E and the inviting #9C3B2F, it evokes the tranquil ambiance of an autumn evening spent by a crackling fire. Designers can leverage this palette to create spaces and digital interfaces that feel grounded, intimate, and secure. The softer #C45F54 adds a gentle glow, while the darker #4A1E15 provides excellent depth. This collection is ideal for projects aiming to convey warmth, tradition, and a sense of cherished comfort, making it perfect for branding, interior design, or publishing.

Best used for

Traditional branding and logos
Cozy cafe or bookstore interior design
Autumnal themed web designs and blogs
Editorial layouts for comfort-focused publications
Packaging for artisanal food or beverage products
User interfaces for meditation or reading apps

Suggested color roles

primary

Use #6B2A1E as a grounding primary for large areas, evoking deep warmth and stability.

secondary

Employ #9C3B2F for calls to action or prominent headings, offering a slightly brighter, inviting tone.

accent

Introduce #C45F54 sparingly for highlights, interactive elements, or illustrative details to add a gentle glow.

background

A very light cream or off-white background will provide a calm contrast, or use #4A1E15 for a dramatic, enveloping feel.

text

For dark backgrounds, use a light cream or white. For lighter backgrounds, #4A1E15 or a dark charcoal offers excellent readability.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using #C45F54 as a background color.
Pair #4A1E15 with light text (e.g., white) for optimal readability on darker elements.
Avoid using #C45F54 and #8A3A2C in close proximity for small text due to potential low contrast.
Test color combinations with accessibility tools to meet WCAG guidelines for text and interactive elements.

Recommended combinations

Ember Glow

For a deep, warm background with inviting accents and highlights.

#4A1E15 · #9C3B2F · #C45F54

Rustic Comfort

Ideal for branding that seeks a traditional, comforting, and slightly elegant feel.

#6B2A1E · #8A3A2C · #C45F54

Deep Read

Creates a rich, layered depth suitable for headers and navigation in a sophisticated design.

#4A1E15 · #6B2A1E · #9C3B2F

CSS variables

:root {
  --cozy-fireside-reading-1: #6B2A1E;
  --cozy-fireside-reading-2: #9C3B2F;
  --cozy-fireside-reading-3: #C45F54;
  --cozy-fireside-reading-4: #4A1E15;
  --cozy-fireside-reading-5: #8A3A2C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cozy-fireside-reading": {
        1: "#6B2A1E",
        2: "#9C3B2F",
        3: "#C45F54",
        4: "#4A1E15",
        5: "#8A3A2C",
      }
    }
  }
}

Hex values

Color 1#6B2A1E

Color 2#9C3B2F

Color 3#C45F54

Color 4#4A1E15

Color 5#8A3A2C

Accessibility

Contrast checker

1.6:1Fail

2.6:1Fail

1.3:1Fail

1.4:1Fail