NBD Nano Digital Brand Guidelines

These are digital brand guidelines for the new NBD Nano brand and site. Use these guidelines as a reference for colors, typography, buttons, overlays and photos moving forward.

01 Color palette

Pure Blue

#FF6B6B

Dark

#221F1F

Dark Sky Blue

#221F1F

Steel Grey

#636860

Grey

#B3B5B2

02 Typography

Headline H1

Font-family: Rubik - Font-size: 55px - Font-weight: medium

Headline H2

Font-family: Rubik - Font-size: 30px - Font-weight: medium

Headline H3

Font-family: Rubik - Font-size: 24px - Font-weight: medium

Headline H4

Font-family: Rubik - Font-size: 22px - Font-weight: medium

Super Text
Font-family: Oxygen - Font-size: 30px - Letter-spacing: 2px. - Case:Uppercase - Font-weight: bold - Color: #a7afb9

Body Font

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Font-family: Oxygen - Font-size: 18px - Line-height: 24px - Letter-spacing: .5px

03 Buttons

Below you will find the primary button used on the site, in default and hover-state. As well as the filters used in the clinical publications section of the website.

Primary Button

Padding-horizontal: 40px - Font-family: Roboto - Font-size: 14px - Case:Uppercase - Font-weight: medium - Text-color: #FFFFFF

Button Text

04 Overlays

Image overlays are used to call attention to text or buttons on top of images and are found throughout the site. Shown below are the two most common overlays. Different colors and opacities may also be used when necessary.