Get your own API key — unlock full power and higher limits

Brand

Logo & Brand Guidelines

Everything you need to represent GENCMS correctly — full logo, icon, and wordmark, in color and white variants. Download the assets and follow the rules below so the mark stays recognizable everywhere it shows up.

GENCMS Full logo On light
GENCMS Full logo on dark On dark

Full logo

min 120px wide

Icon + wordmark. Use this as the default lockup in most places: marketing headers, press kits, product surfaces where space allows.

GENCMS Icon On light
GENCMS Icon on dark On dark

Icon

min 24px

The bold "G" mark on its own. Use in tight spaces — avatars, app icons, nav bars, favicons.

GENCMS Wordmark On light
GENCMS Wordmark on dark On dark

Wordmark

min 96px wide

Text-only lockup. Use when the icon is already present nearby, or in long horizontal footers.

Clear space & sizing

Give the mark room to breathe. Reserve a padding area equal to the height of the icon's corner radius on all four sides — nothing should crowd the logo inside that zone.

clear space Clear space = icon radius
16px 24px 32px 48px 64px

Icon is legible from 16px upward. Below 16px, switch to the favicon SVG for clearer baked-in proportions.

Color palette

The GenCMS mark is built on a single vivid brand purple — #4B14FF. It is a flat, confident color (no gradient) paired with slate for the "CMS" wordmark. Use these exact values when reconstructing the logo or pairing UI elements next to it.

Brand Purple
#4B14FF
Primary — icon, "GEN" wordmark, CTAs
Brand Purple Dark
#3A0FD4
Hover / pressed states
Brand Purple Light
#8A5EFF
Accents, highlights, focus rings
Slate 900
#0F172A
"CMS" wordmark, headlines
White
#FFFFFF
Icon glyph / inverse background
Surface
#F2EFFF
Tinted surfaces, callouts
/* Primary brand color */
color: #4B14FF;
background: #4B14FF;

Do & don't

A few rules that keep the mark recognizable. Stick to them and the logo will feel the same everywhere it shows up.

Do

Use on plain white or near-white backgrounds for maximum contrast.

Do

Use on dark backgrounds — pair with the white-text variant for full legibility.

Don't

Don't place the logo on busy or low-contrast backgrounds.

Don't

Don't skew, recolor, rotate, or add effects. Use the SVG as-is.

Need something we don't have here?

PNGs at exact dimensions, animated variants, or approval for a specific use — we're happy to help. Reach out with the context and we'll turn it around quickly.

Contact the brand team