Collection detail

Transit Authority

The palette of public transit: cerulean line colors, amber warnings, emergency red, and the cool grays of concrete and infrastructure. Designed for maximum legibility at distance and under varied lighting conditions.

Transit Authority draws from a century of public navigation design: the high saturation colors used by metro systems worldwide to ensure unambiguous line identification at a glance. These colors were not chosen for beauty but for maximum discrimination under fluorescent lighting, at distance, and in peripheral vision. As a design palette, they bring an authoritative, utility-forward energy to interface, wayfinding, and technical communication work.

NavigationSignageUI

Why this set works

High-contrast navigation colors drawn from the world's great metro systems — for signage, maps, and wayfinding design.

Wayfinding and signage design

Maps and navigation interfaces

Technical and utility-focused UI

Prompt words

transit map design in high-contrast metro line colorswayfinding system in municipal blue, amber, and redtechnical interface palette in high-saturation navigation colors

Export ready

1. Cerulean Core Vivid #20B7D5
2. Amber Core Vivid #D5B720
3. Ember Core Vivid #D55C20
4. Emerald Core Vivid #20D520
5. Cool Gray Core #737A82
6. Cool Gray Ink #222426

--transit-authority-1: #20B7D5;
--transit-authority-2: #D5B720;
--transit-authority-3: #D55C20;
--transit-authority-4: #20D520;
--transit-authority-5: #737A82;
--transit-authority-6: #222426;

Palette

Each swatch links back to its individual archive detail page.

Back to collections

Cerulean Core Vivid

#20B7D5

Blue · hsl(190, 74%, 48%)

Amber Core Vivid

#D5B720

Yellow · hsl(50, 74%, 48%)

Ember Core Vivid

#D55C20

Orange · hsl(20, 74%, 48%)

Emerald Core Vivid

#20D520

Green · hsl(120, 74%, 48%)

Cool Gray Core

#737A82

Blue · hsl(210, 6%, 48%)

Cool Gray Ink

#222426

Blue · hsl(210, 6%, 14%)

Editorial direction

Collections should do more than group swatches. Each one should read like a usable design direction with a clear emotional lane and a real application surface.

This detail route is the missing layer between a generic palette gallery and a convincing design reference. It gives the set a specific point of view.

Take this palette further

Ready-made tokens for Transit Authority

Palette packs extend these colors into Figma tokens, CSS variables, Tailwind config, and Procreate swatches — structured to drop directly into your project.

Browse packs Free download

Upgrade path

From one collection to a full pack

This collection proves the taste and color direction. The related packs add more collections, token exports, and usage guidance so the palette can move from reference to implementation.

Layer	What you have here	What the related packs add
Scope	One curated five-color editorial direction.	More collections, broader token coverage, and a fuller working set.
Output	Visual palette, copyable CSS preview, and per-color archive pages.	Downloadable CSS, JSON, Tailwind, and pack-specific asset bundles.
Use case	Direction finding, inspiration, and public proof.	Real project handoff, implementation, and reusable product assets.

How transit systems, hospitals, and airports use color to guide millions of people — the principles behind life-critical color system design.