Typography

Clean, thoughtful typography can be the difference between communicating effectively and not communicating at all (literally). Readability and hierarchy are at the center of our type philosophy, with a bold — but highly versatile and readable — sans-serif topping our font stack.

BrandSite_Hero_Typography

Typographic principles

Hierarchy

Strive for strong visual hierarchy, with clear distinction between headers, subheaders, body text, and other key elements. The eye should be clearly guided through a piece of content. 

Readability

Avoid ultralight font weights that are difficult to read at small sizes or on small devices. Choose type sizes that maximize readability for each device type. 

Intentionality

Think consciously about the type decisions you’re making as you build a design. Avoid introducing too many font sizes or weights that aren’t reinforcing hierarchy, and stick to Graphik for all applications except those where some typographic contrast is needed.

Font stack

The Varonis font stack stars a versatile neo-grotesque sans-serif typeface, complemented by a distinctive mono font for visual accents.

Brandminisite_Typography_2022_V1.1_Dark_FullSet_Graphik
Graphik

Graphik is our primary brand font. This versatile typeface can adeptly play any role, from bold landing page headlines to beautiful, publication-level content. Graphik is used for headers, body copy, display text, and more. The character set supports all Varonis-supported languages except Japanese.

Brandminisite_Typography_2022_V1.1_Dark_FullSet_Roboto
Roboto Mono

Roboto Mono is a clean, contemporary monospace font. This secondary font can be used to add texture and visual contrast, such as in eyebrow copy and supporting text in illustrations and diagrams.

Additional fonts

Brandminisite_Typography_2022_V1.1_Dark_FullSet_Bierstadt
Bierstadt

Bierstadt is our fallback Microsoft 365-safe font, used for presentations, spreadsheets, and Word documents.

Brandminisite_Typography_2022_V1.1_Dark_FullSet_Open
Open Sans

Open Sans is used in the Varonis product and is also approved for internal applications, sites, and products. Download it here.

Brandminisite_Typography_2022_V1.1_Dark_FullSet_Nato
Noto Sans JP

Use Noto Sans JP for Japanese-language content. Download it here.

Type scale

The scale is based on a 6px system, where the type is divisible by six. Use the following guidelines to create a visually appealing point size/leading ratio, reducing the ratio as the type gets larger, and opening it up as the type gets smaller.

Graphik

  • 96/96 We protect data.
  • 72/72 We protect data.
  • 60/64 We protect data.
  • 48/52 We protect data.
  • 30/36 We protect data.
  • 24/32 We protect data.
  • 21/28 We protect data.
  • 18/26 We protect data.
  • 16/26 We protect data.
  • 14/24.5 We protect data.
  • 12/18 We protect data.

Application guidelines

Font weights

There are a limited number of approved font weights to ensure readability and clean visual hierarchy.

type-fontweights-graphiksemibold
Graphik Semibold

Use for headers and subheaders.

type-fontweights-graphikreg
Graphik Regular

Use for body copy, footnotes, boilerplates, and more.

type-fontweights-robotomonoreg
Roboto Mono Regular

Use in illustrations and diagrams and as accent text.

type-fontweights-graphikbold
Graphik Bold

Use only in unique applications, such as non-standard branding, internal graphics, etc.

type-fontweights-graphiklight
Graphik Light

Avoid lightweight fonts. They were trendy five years ago, but now they’re just hard to read!

Color roles

color-role-navy

Headers, subheads, body text, backgrounds

color-role-white

Headers, subheads, body text, backgrounds

color-role-electricblue

Subheaders, text links, hover states, backgrounds

color-role-lightgrayiii

Dividers