Back to palettes

Palette

Sweet Licorice Swirl

A smooth gradient of deep charcoal to soft gray, inspired by the dark, subtle sweetness of licorice.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sweet Licorice Swirl 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 Sweet Licorice Swirl.

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

Data visualization

#1A1A1A#3B3B3B#5A5A5A#7D7D7D#E8E8E8

Palette guide

How to use Sweet Licorice Swirl

Overview

The "Sweet Licorice Swirl" palette offers a sophisticated monochrome gradient, inspired by the subtle sweetness and depth of licorice. Ranging from a deep, rich black (#1A1A1A) to a soft, almost smoky grey (#E8E8E8), this collection includes versatile shades like #3B3B3B, #5A5A5A, and #7D7D7D. This palette is ideal for designs that aim for a minimal, elegant, and timeless aesthetic. Designers can effectively use these hues for corporate branding, modern UI elements, or sophisticated digital illustrations, ensuring a cohesive and professional visual experience that provides excellent contrast and readability across various applications.

Best used for

  • Minimalist website designs
  • Corporate branding and reports
  • Tech and software interfaces
  • Elegant fashion photography backgrounds
  • Print design and typography focus
  • Dark mode UI themes

Suggested color roles

primary

Utilize #1A1A1A (Deep Black) for dominant headlines, key graphical elements, or as a powerful background for high contrast.

secondary

Apply #3B3B3B (Dark Grey) for subheadings, secondary UI elements, or significant content blocks to add depth without harshness.

accent

Employ #5A5A5A (Medium Grey) sparingly for subtle highlights, interactive elements, or decorative patterns to add refinement.

background

Use #E8E8E8 (Light Grey) as a clean, neutral backdrop that provides excellent contrast for darker text and elements.

text

For primary body text, #1A1A1A or #3B3B3B offers optimal readability on light backgrounds. For dark backgrounds, #E8E8E8 provides clear contrast.

Accessibility notes

  • Ensure sufficient contrast between text and background. For instance, #1A1A1A text on #E8E8E8 background is highly legible.
  • Avoid using #7D7D7D for small text on #E8E8E8 background, as contrast may be insufficient for some users.
  • When designing dark mode, use #E8E8E8 for text on #1A1A1A or #3B3B3B backgrounds for optimal readability.
  • Always test text legibility at various font sizes and weights, especially when using mid-tone greys like #5A5A5A.

Recommended combinations

Classic Contrast

Creates a timeless, high-contrast look, ideal for professional websites or print materials.

#1A1A1A · #E8E8E8 · #5A5A5A

Subtle Depth

Offers a softer gradient for backgrounds, shadows, or secondary UI elements, providing gentle visual separation.

#3B3B3B · #7D7D7D · #E8E8E8

Modern Edge

Use the darkest color as a base, with medium and lighter greys for layering and subtle graphic details in a minimalist design.

#1A1A1A · #5A5A5A · #7D7D7D

CSS variables

:root {
  --sweet-licorice-swirl-1: #1A1A1A;
  --sweet-licorice-swirl-2: #3B3B3B;
  --sweet-licorice-swirl-3: #5A5A5A;
  --sweet-licorice-swirl-4: #7D7D7D;
  --sweet-licorice-swirl-5: #E8E8E8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sweet-licorice-swirl": {
        1: "#1A1A1A",
        2: "#3B3B3B",
        3: "#5A5A5A",
        4: "#7D7D7D",
        5: "#E8E8E8",
      }
    }
  }
}

Related searches

monochrome black grey paletteminimalist dark color schemeelegant grey web designhigh contrast ui colorslicorice inspired branding

Palette colors

Hex values

Color 1#1A1A1A
·
Color 2#3B3B3B
·
Color 3#5A5A5A
·
Color 4#7D7D7D
·
Color 5#E8E8E8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.5:1Fail
4.2:1AA18
14.2:1AAA
2
1.6:1Fail
1.6:1Fail
2.7:1Fail
9.1:1AAA
3
2.5:1Fail
1.6:1Fail
1.7:1Fail
5.6:1AA
4
4.2:1AA18
2.7:1Fail
1.7:1Fail
3.4:1AA18
5
14.2:1AAA
9.1:1AAA
5.6:1AA
3.4:1AA18

Similar palettes

More like Sweet Licorice Swirl

View all monochrome