Aa
Instrument Serif
Display & headings. Regular 400 only — never bold it; the weight is part of its character.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
iCreate Your Site
Brand
Brand
Guidelines
The logo, the colours and the type that make up the iCreate Your Site identity — with every file you need to use them correctly.
01
The logo
A hand-lettered script wordmark. It is drawn artwork, never type — so it is always placed as a supplied file and never re-set in a font.
Primary — Black
On white and light backgrounds. The default.
Reversed — White
On navy, photography and any dark ground.
Navy
For brand-led layouts on pale tints. Never on dark.
Use the SVG wherever the medium allows it. It stays sharp at any size, from a business card to a vehicle wrap. Reach for the PNG only where vector isn't supported — email signatures, some social profiles, older office software.
02
The monogram
The iC lifted from the wordmark. It exists for the places the full script would be illegible — favicons, app icons, profile pictures, a stamp on a photograph.
The monogram is a shorthand, not a replacement. Where there is room for the full wordmark, use the full wordmark.
03
Clear space & minimum size
The logo needs room to breathe. Keep other elements outside the margin below, and never place it smaller than it can be read.
x
Minimum clear space on all four sides equals x, the cap height of the C. Nothing — type, images, edges of a page — enters it.
Minimum sizes
-
Wordmark, digital180 px wide minimum
-
Wordmark, print32 mm / 1.25 in wide minimum
-
Monogram24 px — below this, use the favicon
04
What not to do
The wordmark is drawn artwork with a fixed weight and proportion. Everything below breaks it.
MIAMI
05
Colour
Navy carries the brand; the accent blue is used sparingly, for the things you want clicked. Click any swatch to copy its hex.
Core
Navy scale
Neutrals & signal
Accessibility. Navy on white is 12.6:1 and passes everywhere. Accent blue on white is 3.1:1 — fine for large text, buttons and icons, not for body copy. For small text on white, use Gray 700 or darker.
06
Typography
Two families, each with one job. A serif that does the talking and a sans that gets out of the way.
Aa
Inter
Body, navigation, buttons, labels. Weights 400 / 500 / 600 / 700 / 800.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
The scale
Websites that work
Built in Miami
Section heading
Body copy sits at sixteen pixels with generous leading, because most of the people reading it are on a phone.
Overline label
08
Everything, in one file
Both logos in every colour, as SVG and PNG, plus the three profile pictures and the share image.
Download the brand kit
Sending this to a printer, a magazine or a sponsor? Send them this page — icreateyoursite.com/brand/ — rather than a loose file. It stays current.
Social & profile
Square avatars are cropped to a circle almost everywhere, so the mark sits well inside a safe area. Supplied at 1000 × 1000 px.
Share image
1200 × 630 px, the size Facebook, LinkedIn, X and iMessage all read from
Download share imageog:image. Keep anything important away from the outer 10% — different platforms crop different amounts.