Visor Brand & Design Guidelines
🎨

Visor Brand & Design Guidelines

icon
Updated May 1, 2023

Tokens

Colors

Digital

Colors.pdf1472.7KB
image

Pantone

Visor brand blue: Pantone 2382 C (https://www.pantone.com/color-finder/2382-C)

Visor brand green: Pantone 7479 C (https://www.pantone.com/color-finder/7479-C)

Logos

image
image

image
image

image
image

Logo Usage

Logo.pdf938.7KB
image

Typography

Lato Font.zip649.6KB
Typography Reference.pdf805.1KB
image

Textures

Waves

Backgrounds are comprised of a base layer with a linear gradient. One or multiple texture wave layers are overlaid on top.

💡
The base layer background color linear gradient transitions from #000204 (top-left) to #02162A (bottom-right).

image

Glass

“Glass” effects are used to frame content, specifically application snapshots.

image

Animation

Beams

Light beams indicate movement in rigid space.

image

Arcs

Light arcs indicate movement in free space.

image

Text Lighting

Text takes on several states to mimic a light up effect, helping to indicate focus.

image

Skewing

Individual and groups of elements can be skewed to simulate organic motion, helping to indicate a large change in the narrative.

image

Morphing

Individual and groups of elements can morph into other elements, helping to move a narrative forward.

image

Tone

Visor’s 3 pillars are flexibility, trustworthiness, and share-ability. These pillars ensure satisfaction and success while customers manage large + complex datasets.

😏
To balance against the pressure customer users may feel in their professional roles, our communications convey a tone of tongue-in-cheek humor and playfulness.

image