Brand Guide

This is the official brand guide for VSHN.

Logos

Click on any image for a full size version.

Color

SVG PNG (White background) PNG (Transparent background)

Main

2021 LOGO VSHN color

2021 LOGO VSHN color

2021 LOGO VSHN color transparent

Square

2021 LOGO VSHN color square

2021 LOGO VSHN color square

2021 LOGO VSHN color square transparent

No Text

2021 LOGO VSHN color notext

2021 LOGO VSHN color notext

2021 LOGO VSHN color notext transparent

Square, no text

2021 LOGO VSHN color notext square

2021 LOGO VSHN color notext square

2021 LOGO VSHN color notext square transparent

White (Transparent Background)

SVG PNG

Main

2021 LOGO VSHN white

2021 LOGO VSHN white

Square

2021 LOGO VSHN white square

2021 LOGO VSHN white square

No Text

2021 LOGO VSHN white notext

2021 LOGO VSHN white notext

Square no text

2021 LOGO VSHN white notext square

2021 LOGO VSHN white notext square

Download all logos in a single zip file: vshn_logos.zip.

Color Codes

Onyx (logo)

rgb(68, 68, 68) or #444444.

Example
Steel Blue (logo)

rgb(64, 129, 203) or #4081CB

Example
Rich Black (titles, main text, background)

rgb(0, 13, 26) or #000D1A

Example
Amber (buttons, illustrations)

rgb(255, 191, 0) or #FFBF00

Example
Capri (links, illustrations, indicators)

rgb(76, 195, 255) or #4CC3FF

Example

Font

The official VSHN font is Montserrat, designed by Julieta Ulanovsky, Sol Matas, Juan Pablo del Peral, and Jacques Le Bailly.

  • Headers use Montserrat Bold with font weight 900.

  • Body text uses Montserrat Regular with font weight 400.

CSS

Include the Montserrat font in your projects using this command:

$ npm install typeface-montserrat

Make it available to your stylesheets as follows:

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 400;
  src:
    local("Montserrat Regular"),
    local("Montserrat-Regular"),
    url(~typeface-montserrat/files/montserrat-latin-400.woff2) format("woff2"),
    url(~typeface-montserrat/files/montserrat-latin-400.woff) format("woff");
}

@font-face {
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 400;
  src:
    local("Montserrat Italic"),
    local("Montserrat-Italic"),
    url(~typeface-montserrat/files/montserrat-latin-400italic.woff2) format("woff2"),
    url(~typeface-montserrat/files/montserrat-latin-400italic.woff) format("woff");
}

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: 900;
  src:
    local("Montserrat Bold"),
    local("Montserrat-Bold"),
    url(~typeface-montserrat/files/montserrat-latin-900.woff2) format("woff2"),
    url(~typeface-montserrat/files/montserrat-latin-900.woff) format("woff");
}

@font-face {
  font-family: "Montserrat";
  font-style: italic;
  font-weight: 900;
  src:
    local("Montserrat Bold Italic"),
    local("Montserrat-BoldItalic"),
    url(~typeface-montserrat/files/montserrat-latin-900italic.woff2) format("woff2"),
    url(~typeface-montserrat/files/montserrat-latin-900italic.woff) format("woff");
}

Company Description

VSHN - The DevOps Company

VSHN automates the operation of applications in the cloud or on-premise, so that you as a software developer can have peace of mind and build your awesome application. VSHN is the Ops in DevOps.