Brand Guidelines
These guidelines help you use the Vendure brand consistently. Whether you're a partner, contributor, or journalist, you'll find everything you need to represent Vendure correctly. Please don't modify, distort, recolor, or reconfigure the Vendure logo. If you have questions about usage, reach out to us.
Logo
Primary Logo
The primary Vendure logo combines the logomark (icon) and wordmark. Use this version whenever possible.
Primary Logo
SVGPrimary Logo
PNG
Iconmark
SVG
Iconmark
PNGAdditional Variants
Additional logo variants for different contexts. Use the light version on dark backgrounds and the dark version on light backgrounds.
Logo - Light
SVG
Logo - Dark
SVG
Iconmark - Light
SVG
Iconmark - Dark
SVGLogo Usage Guidelines
Do
- Use the official logo files provided above
- Maintain adequate clear space around the logo
- Use the light logo on dark backgrounds and the dark logo on light backgrounds
- Use SVG format whenever possible for crisp rendering at any size
Don't
- Alter the logo colors or apply gradients
- Stretch, skew, or rotate the logo
- Add drop shadows, outlines, or other effects
- Place the logo on busy or low-contrast backgrounds
- Recreate or substitute the logo with a different typeface
Color palette
Primary Colors
Our primary color palette defines the core Vendure visual identity.
Vendure Blue
#17C1FFPrimary brand color. Logo, links, interactive elements, CTAs.
White
#FFFFFFPrimary text on dark backgrounds. Logo light variant.
Deep Black
#09090BPrimary background. Main canvas for the dark theme.
Secondary Colors
Supporting colors used for accents, states, and UI elements.
Muted Gray
#A1A1AASecondary text, descriptions, subtle UI elements.
Border Gray
#27272ABorders, dividers, card outlines.
Surface
#18181BCard backgrounds, elevated surfaces.
Success Green
#22C55ESuccess states, positive indicators.
Warning Amber
#F59E0BWarning states, attention indicators.
Error Red
#EF4444Error states, destructive actions.
Typography
Typefaces
Vendure uses a carefully selected set of typefaces that balance readability, personality, and technical clarity.
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
const vendure = new VendureServer(config);
const vendure = new VendureServer(config);
const vendure = new VendureServer(config);
