Primary lockup
The default. Use it on white, paper and any light ground.
Brand assets
The SiteAssay brand, ready to use
The logo, colours, type and product imagery, with the rules for using them and every file to download. Writing about us, listing us as a partner or building an integration? Start here.
Logo
A raptor that reads as Sa
The mark is a double-line S that rises into a raptor's head, with a lowercase a in its lower bowl and the a's stem stepping through as the leg. It watches, which is what an audit does. The name beside it is set in Righteous and is always one colour, so the mark carries the colour and the name stays calm.
Primary lockup, dark
For night and other dark grounds.
Primary lockup, on violet
For the brand violet only.
Stacked lockup
For square and narrow spaces: badges, posters, merchandise.
Stacked lockup, dark
The stacked lockup for dark grounds.
Stacked lockup, on violet
The stacked lockup for the brand violet.
Mark
The raptor on its own, where the name is already nearby.
Mark, dark
The mark for dark grounds.
Mark, on violet
The mark for the brand violet.
App icon
The square icon for app stores, avatars and favicons.
Wordmark
The name alone, for credits and partner listings.
Wordmark, white
The name alone, for dark and violet grounds.
One colour, violet
Single-colour print, embossing and engraving on light stock.
One colour, white
Single-colour print, photography and video overlays.
Clear space
Keep a margin around the logo equal to a quarter of the mark's height, the size of the raptor's head. Nothing else, including other logos and the edge of the page, comes inside it.
Minimum size
Below these sizes the bands close up. Use the mark alone, or the app icon, when the space is smaller.
Colour
Violet first, the spectrum for meaning
Violet and paper carry the brand. The spot colours are for illustration and for results, where a colour means pass, warn or fail, and they are the six bands of the mark from head to foot.
Brand colours
Violet
- HEX
- #3D1D7A
- RGB
- 61 29 122
- Token
- --color-brand
The brand colour: the wordmark, primary buttons and headings.
Bright violet
- HEX
- #6741E8
- RGB
- 103 65 232
- Token
- --color-brand-mid
Accents, links and the second band of the mark.
Night
- HEX
- #221241
- RGB
- 34 18 65
- Token
- --color-night
The dark ground for the mark and for dark mode.
Paper
- HEX
- #FAF6EE
- RGB
- 250 246 238
- Token
- --color-paper
The light ground. Warmer than white, and the default page.
Tint
- HEX
- #E6DDFA
- RGB
- 230 221 250
- Token
- --color-brand-tint
Quiet fills, selected states and the head of the mark on dark.
Assay gold
- HEX
- #C8952F
- RGB
- 200 149 47
- Token
- --color-mark-bead
The beak plane of the mark. Gold is used sparingly, and only for meaning.
Spot colours
Sky
- HEX
- #4E8FD9
- RGB
- 78 143 217
- Token
- --color-spot-sky
Illustration, charts and the third band.
Mint
- HEX
- #3FAE7C
- RGB
- 63 174 124
- Token
- --color-spot-mint
Passing results and the fourth band.
Amber
- HEX
- #F5843C
- RGB
- 245 132 60
- Token
- --color-spot-amber
Warnings and the fifth band.
Rose
- HEX
- #EE4E9B
- RGB
- 238 78 155
- Token
- --color-spot-rose
Failures, highlights and the sixth band.
Sun
- HEX
- #F5C044
- RGB
- 245 192 68
- Token
- --color-spot-sun
Calls to action on violet, and eyebrows on dark.
- Band 1 Violet, the head
- Band 2 Bright violet, the neck
- Band 3 Sky, the spine
- Band 4 Mint, the top of the a
- Band 5 Amber, the lower a and the tail
- Band 6 Rose, the foot
- Beak Assay gold, the only gold on the logo
Typography
Four faces, each with one job
All four are open source and free to use. Righteous belongs to the name alone; the other three set everything else, on the site and in the product.
SiteAssay
The brand name in the logo, and nothing else. Never set headlines or body copy in it.
Diagnose. Prove. Close.
Headlines, page titles and pull quotes, always set large.
Every finding comes with the evidence printed beside it.
Body copy, the product interface, tables and forms.
SCORE 72 / 100
Eyebrows, buttons, check identifiers, code and any number compared down a column.
Icons and elements
A small kit of shapes
Line icons on a 24-unit grid with round caps, the offset tile, and pastel tints. They are what makes a SiteAssay page recognisable before the logo is in view.
search
gauge
shield-check
lock
mail
pin
globe
eye
file
list
bars
target
dial
bolt
flag
signal
code
terminal
book
key
link
clock
filter
sparkle
The offset tile
A rounded square with a hard shadow set down and to the right. Used for icons, feature tiles and illustration. Never a blurred shadow.
Tints
Each card in a row takes a different pastel, so a grid reads as one composition. The tints follow the theme and land correctly on paper and on night.
Product imagery
The product, as it is
Screenshots of the application with a demo agency's data, at twice screen resolution. Each comes in light and dark; the page shows whichever matches your system. Please do not crop out the interface chrome or alter the figures on screen.
Guidelines
Do's and don'ts
The logo works because it is always drawn the same way. Use the files on this page as they are, and if a placement needs something they do not cover, ask us first.
Use the supplied files
Download the logo from this page rather than redrawing it, tracing it or taking it from a screenshot.
Match the variant to the ground
The primary lockup on light grounds, the dark lockup on night, the on-violet lockup on brand violet, and one colour where only one ink is available.
Write the name as one word
SiteAssay, with a capital S and a capital A. Never Site Assay, Siteassay or Site-Assay.
Downloads
Everything in one file
The logo, the stacked logo, the mark, the wordmark and the app icon, each as SVG and as a high-resolution PNG, in every colour version.
Download the brand kit ZIP, 544 KB