Compliance Alliance Charter Design System · v0.1
Foundations

Brand & logo

Charter is not a rebrand. Compliance Alliance already has an identity that 38 state banking associations recognize and trust — a confident green mark and a plain, serious wordmark. Our job is to lean into it: carry its color, its calm, and its seriousness into every screen, and handle the logo with the care it has earned.

We inherited this brand — we didn't invent one. The logo, the green, the name belong to Compliance Alliance. Everything in this design system is downstream of the identity on this page. When in doubt, defer to the mark.

The logo

The official lockup: the mark and the wordmark, set as one. This is the primary signature — use it wherever there's room to breathe.

Compliance Alliance logo

Two forms, one identity

The full lockup and the mark are the same brand at two sizes of confidence. Reach for the lockup first; use the mark where space is tight or the brand is already established on the page.

Full lockup
Full lockupHeaders, documents, sign-in, the footer — anywhere the brand is introduced.
The mark
The markApp icon, favicon, avatar, the product top bar — tight spaces and repeat appearances.

The mark, up close

Compliance Alliance mark

A C and an A joined by a rising check — Compliance, Alliance, and the forward motion of getting it right. It reads as a monogram and a checkmark at once.

C
Compliance
Done right
A
Alliance

Clear space & minimum size

Give the logo room. Keep clear space equal to half the logo's height on every side — nothing (text, rules, other logos) intrudes. Never reproduce it below its minimum size.

clear space = ½ logo height
Clear space
Full lockup · min 120px / 1in print
Mark · min 20px
Favicon · 16px floor

Color

Two colors carry the brand. The system's Pine ramp is tuned around this exact green — the logo is the source of truth.

Mark green#208649
Wordmark ink#333E48
Field white#FFFFFF

Reversal & one-color

Full color on white
Reversed on ink
One-color white knockout on brand green

Full color on white · reversed on ink (white wordmark, the mark keeps its green) · one-color white on brand green, where the C ✓ A is knocked out so the field shows through. Use full color whenever the background allows.

The mark in use

Where the brand repeats or space is tight, the mark stands in — favicon, app icon, avatar, and the product's own top bar.

Compliance Hub
Browser tab
App icon
Favicon 32
Avatar
Compliance Hub
Product top bar

Misuse

The fastest way to look untrustworthy is to mishandle the mark. Don't.

Don't stretch or squash.
Don't recolor.
Don't rotate or tilt.
Don't place on a busy field.
Don't add shadows or effects.
Don't add a keyline or box it in.
Leaning in, not starting over. Every choice in Charter traces back here — the green is this green, the calm is this seriousness, the trust we ask for is the trust this mark already carries. We're not asking members to learn a new brand. We're giving the one they know a system worthy of it.