Brand Guide
This interactive guide documents the visual language and components used across WebMarkets digital products.
Our Mission
WebMarkets is a marketing partner that owns strategy, creative, and technical execution end-to-end so growth-stage organizations can scale without building internal marketing or development teams.
Brand Voice & Tone
Authoritative
We don't guess. We speak with the confidence of experts who own the execution and the results.
Direct
No fluff. No agency jargon. We focus on what matters: performance, delivery, and growth.
Technical
We embrace the complexity of the stack. Our tone reflects our deep technical depth and discipline.
Colors
Graphite
#0C111D (Background)
Panel
#111827 (Cards)
Heat
#EF4444 (Primary)
Ice
#3B82F6 (Secondary)
Powder
#06B6D4 (Accent)
Typography
Display (Space Grotesk)
Main Heading
Usage: Hero headlines, section titles.
Sans (Inter)
Inter is used for body copy and general content. It should always have a high line-height for readability.
Usage: Body text, paragraphs.
Mono (JetBrains Mono)
SECTION LABEL 01
Usage: Labels, numbers, technical data.
Corner Radius
Standard Radius
12px / 0.75rem
To maintain a consistent technical aesthetic, we use a uniform 12px radius across all primary components, including cards, buttons, and image containers.
Grid & Spacing
Background Texture
The Signature Grid
Our visual identity is built on a 40px x 40px technical grid. This represents the precision and technical depth of our execution.
Cards & Panels
Standard Card
Interactive Panel
Our standard container for content blocks. Features a subtle border and glass-morphism background.
Alternative Style
Flat Panel
A more structured, non-glass alternative for technical documentation or data-heavy views.
Form Elements
Imagery Style
Contrast: Use deep blacks and high-contrast lighting for a premium, technical feel.
Tints: Apply subtle brand blue/red overlays to stock photography for consistency.
Depth: Use bottom-up gradients to ensure text legibility over images.
Animations
Standard Bounce
Pulse Glow
Glows & Gradients
Background Blur Glow
Social & Ads
Instagram / Facebook (1080x1080)
High-Performance
Marketing Execution
We own the strategy, creative, and technical delivery end-to-end.
webmarkets.com
LinkedIn / Display (1200x628)
Own the Work.