Smart Cities Solutions

Brand

Brand style guide

One page covering the Smart Cities Solutions palette, typography, buttons and spacing rules.

Colors

Metallic Gold

#F6D76B

Highlights, rules and premium accents

Royal Azure

#3E7BD6

Primary buttons, links, active tabs

Pearl White

#FFFFFF

Primary page and card background

Deep Royal Blue

#17335D

Headings and high-contrast text

Signal Cyan

#4FB6D8

Technical highlights, circular rings

Warm Green

#C9A24B

Contact icons, secondary accents

Typography

Sora — Headings

Display face for H1–H4, eyebrows and buttons. Tracking -0.02em. H1 48–60px, H2 32–40px, H3 20–24px.

Manrope — Body copy

Body 16px / 1.7 line height, small text 14px, captions 12px. Eyebrow labels are 11.5px uppercase with 0.22em letter spacing.

Buttons

RadiusPills (999px) for nav & CTA, 8px for cards
Padding20px horizontal / 10px vertical
Label14px semibold, Sora
Focus ring2px #F6D76B at 30% opacity

Spacing rules

Base unit4px scale (4 / 8 / 12 / 16 / 24 / 32)
Page gutters20px mobile, 32px desktop
Max content width1280px
Section rhythm80px mobile, 112px desktop
Card padding32px desktop, 24px mobile
Grid gaps20–24px between cards

Approved lockup

Logo usage

Approved Smart Cities Solutions logo
Approved artworkMidpoint wordmark proportions only
Header logo40px mobile / 48px tablet / 56px desktop
Logo container12px horizontal / 6px vertical
Header spacing20px mobile / 24px tablet / 32px desktop
Clear spaceAt least the symbol stroke width on every side
BackgroundPearl white; never place directly on photography
BorderMetallic gold at 50% strength
FormatsSVG for interface, PNG for documents and sharing

Do not redraw, recolor, stretch, crop, or change the spacing between the symbol and wordmark. Keep Smart Cities blue and green, Solutions gray, and surrounding accents metallic gold.