FEATURED COLLECTION

Midnight Gallery

A sophisticated blend of deep architectural shadows and vibrant electric accents.

Deep Onyx#191C1D
Electric Cobalt#1B31E7
Periwinkle Mist#BDC2FF
Gallery White#F8F9FA
Burnt Ember#932F00

About this palette

Midnight Gallery pairs near-black architectural surfaces with an electric cobalt that behaves like a spotlight in a dark room. The mood is confident and nocturnal — think contemporary art museum after hours rather than corporate lobby. It suits brands that want drama without noise: creative agencies, photography portfolios, music and streaming products, and premium tech launches. Use Deep Onyx and Gallery White as your structural pair, let Electric Cobalt own every interactive element, and save Periwinkle Mist and Burnt Ember for highlights that deserve a second look.

Best forDark-mode interfaces, hero sections, product launches that need presence

Accessibility Check

We prioritize WCAG 2.1 standards. Ensure your text remains legible by checking contrast ratios across the palette.

✔ WCAG AA Compliant
Aa

Deep Onyx

17.1 : 1

Pass
Aa

Electric Cobalt

8.0 : 1

Pass
Aa

Periwinkle Mist

1.7 : 1

Low
Aa

Gallery White

1.1 : 1

Low
Aa

Burnt Ember

7.9 : 1

Pass

Explore the Full Collection

Curated Color Palettes for Web Apps & Brands

Our Explore Gallery provides a hand-curated catalog of designer-tested color combinations. Unlike automated color generators that yield unpredictable contrast conflicts, every palette in our collection is curated with explicit visual hierarchy, semantic role assignments, and pre-calculated WCAG 2.1 accessibility scores.

1. Selecting Palettes by Brand Mood & Industry

Colors evoke subconscious psychological responses. Tech platforms and SaaS products benefit from cool, trust-building blues and slates (like our Clean Corporate gallery). Luxury, editorial, and dark-mode web apps excel with high-contrast obsidian and gold accents (featured in our Midnight Gallery).

2. Pre-Validated WCAG 2.1 Contrast Metrics

Every featured gallery includes real-time contrast ratio checks against white and dark backgrounds. We verify whether text pairs pass AA (4.5:1 ratio) or AAA (7:1 ratio) compliance before you write a single line of CSS. Read our WCAG Color Contrast Guide for full standards.

3. Rapid Code Export & Token Integration

Copy individual Hex swatches with a single click, or transform an entire palette into production code snippets using our Palette Exporter. Generate Tailwind CSS configs, native CSS variables, or structured JSON design tokens instantly.

4. In-Depth Color Theory Resources

Master how light and color interact across digital screens. Dive into our Complete Color Theory Guide, explore 60+ Tested Color Combinations, or study Color Psychology in UI Design.

Frequently Asked Questions

Are these color galleries free for commercial projects?

Yes! All color palettes, Hex codes, and exported code tokens featured in our gallery are 100% free and open for use in personal, client, and commercial projects.

How are new gallery collections added?

Our design team regularly adds new galleries based on emerging UI design trends, seasonal palettes, and requested industry themes. Check back frequently for fresh inspiration.