Back to palettes

Palette

Hushed Library Pages

Soft greys and off-whites capturing the quiet ambiance and aged beauty of an old library's pages.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Hushed Library Pages 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 Hushed Library Pages.

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

Data visualization

#A9A9A9#708090#D3D3D3#B0C4DE#F5F5F5

Palette guide

How to use Hushed Library Pages

Overview

The Hushed Library Pages palette evokes a sense of quiet sophistication and timeless elegance, perfect for designs seeking a calm, contemplative atmosphere. Dominated by soft greys and subtle off-whites, this palette includes grounding tones like #708090 (Slate Gray) and #A9A9A9 (Dark Gray), balanced by the ethereal #F5F5F5 (White Smoke) and gentle #D3D3D3 (Light Gray). A hint of cool #B0C4DE (Light Steel Blue) adds a touch of understated depth, reminiscent of aged paper and serene study spaces. Designers and developers can leverage its minimalist nature for refined user interfaces and dignified branding, providing a sophisticated backdrop that promotes focus and introspection.

Best used for

  • Academic institution websites
  • E-commerce for artisanal goods
  • Minimalist blog designs
  • Luxury stationery branding
  • Editorial layouts for literary magazines
  • Architectural portfolio presentations

Suggested color roles

primary

#708090 serves as a robust yet understated primary, ideal for main headings or key UI elements that require a grounding presence.

secondary

#A9A9A9 offers a versatile secondary color, excellent for body text, subheadings, or background sections that need a softer touch than the primary.

accent

#B0C4DE provides a subtle, calming accent, perfect for hover states, interactive elements, or delicate graphic details without overpowering the serene mood.

background

#F5F5F5 creates a clean, airy base, mimicking aged parchment and ensuring high readability for most text.

text

For optimal readability, use a dark charcoal or black on #F5F5F5. #708090 works well for headings, while #A9A9A9 is suitable for body text on lighter backgrounds.

Accessibility notes

  • Ensure sufficient contrast between #A9A9A9 or #708090 and #F5F5F5 for all body text.
  • Avoid placing light text on #D3D3D3 without checking WCAG contrast ratios.
  • Use #B0C4DE sparingly as an accent to avoid readability issues if paired with light text.
  • Prioritize dark text (e.g., black or charcoal) on the lightest backgrounds like #F5F5F5 and #D3D3D3.

Recommended combinations

Clarity & Depth

Ideal for clean content areas where #F5F5F5 is the background, #708090 for titles, and #A9A9A9 for body text, offering strong hierarchy.

#F5F5F5 · #708090 · #A9A9A9

Subtle Highlight

Use #D3D3D3 as a section background, #B0C4DE for a soft interactive element, and #708090 for accompanying text or icons.

#D3D3D3 · #B0C4DE · #708090

Layered Greys

Create depth with #A9A9A9 as a base, #708090 for overlays or cards, and #F5F5F5 for internal content or contrasting elements.

#A9A9A9 · #708090 · #F5F5F5

CSS variables

:root {
  --hushed-library-pages-1: #A9A9A9;
  --hushed-library-pages-2: #708090;
  --hushed-library-pages-3: #D3D3D3;
  --hushed-library-pages-4: #B0C4DE;
  --hushed-library-pages-5: #F5F5F5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "hushed-library-pages": {
        1: "#A9A9A9",
        2: "#708090",
        3: "#D3D3D3",
        4: "#B0C4DE",
        5: "#F5F5F5",
      }
    }
  }
}

Related searches

quiet color schemesminimalist grey palettesvintage library colorsmuted design inspirationsoft neutral branding

Palette colors

Hex values

Color 1#A9A9A9
·
Color 2#708090
·
Color 3#D3D3D3
·
Color 4#B0C4DE
·
Color 5#F5F5F5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
1.6:1Fail
1.3:1Fail
2.2:1Fail
2
1.7:1Fail
2.7:1Fail
2.3:1Fail
3.7:1AA18
3
1.6:1Fail
2.7:1Fail
1.2:1Fail
1.4:1Fail
4
1.3:1Fail
2.3:1Fail
1.2:1Fail
1.6:1Fail
5
2.2:1Fail
3.7:1AA18
1.4:1Fail
1.6:1Fail

Similar palettes

More like Hushed Library Pages

View all monochrome