Digital Brand Guidelines
This is a detailed guide for the usage and details of the SBI brand, including: logos, logo variants, color usage & codes, typography, visual & icon style, and messaging.
Internal & external teams can use this page as a reference to ensure branding consistency is maintained across all platforms.
Logos
The logo is one of the most recognizable elements of brand identity. Consistently applied placements, clear space, and color treatments ensure the logo remains iconic in any context.
Let's get the brand out there, but get to know the rules too: no putting it upside down, stretching it, or doing anything else funky.
Use the SVG file type for the most clean version of the file since it is in vector format and can scale without losing quality. If a PNG is used, make sure to pay attention to file size and resolution as the logo is applied.
If a single logo is needed, simply right-click the image below and select "Save As".
Download the full logos kit with the button below.
Logos Primary
Our primary logos in the system appear simply with the logo mark and SBI logotype.
%20-%20Dark%20Text.svg)
%20-%20Light%20Text.svg)
%20-%20Dark.svg)
%20-%20Light.svg)
Secondary Logos
Our secondary logos in the system appear with the logo mark plus the full tagline + SBI logotype.
.svg)
%20-%20Dark%20Text.svg)
%20-%20Light%20Text.svg)
%20-%20Dark.svg)
%20-%20Light.svg)
Misuse
It is important that the appearance of the logo remains consistent. It should not be reinterpreted, modified or embellished. No attempt should be made to alter the logo in any way. Below are some common mistakes to avoid.
Skewed
Stretched vertically
Stretched horizontally
Tilted
Drop shadow
Vertical orientation
Scalability
The logos were designed and tested to work at various sizes. The minimum logo size for adequate legibility is 16px height. Never go smaller than this. Establishing a minimum size helps ensure that the logo’s legibility is never compromised.
Smallest
Largest
Clearspace
When applying our logo, it is important that it is given enough space from the margins and other elements on the page.
To make this self-relative, simply use the logomark as the guide to spacing from other objects.
Construction
Below is the logic of spacing and construction of the logo and tagline logo.
Every gap between the words, mark, and mark pieces are based on 1x or 1.5x the "i" character.
Clarity
When creating a composition, it is important to have enough contrast between background and logo to maximize legibility. Below are don’ts for logo clarity.
Similar colors
Dark on dark
Light on light
Colors
Our main palette uses the following colors to help bring a unique identity to your brand. The color are used in logical ways throughout the brand to guide users and create the emotional connection SBI is after.
SBI Black is slightly blue. We never use "true black" in the brand. This keeps even the darkest text uniquely SBI and paired well with the SBI orange.
Use the HEX/RGB values on anything digital.
If the brand is being printed, it will depend on the printers color profile settings, but you can refer to the CMYK values as needed. To get the closest real-world consistency, use Pantone colors and/or references to Pantone swatches.
Primary
SBI Black
SBI Orange
White
Neutrals
Light Grey
Shades
Dark Grey
Typography
The typography for SBI is straight-forward with a polished simplicity. The typography gives all the key information but never talks over the main content.
We follow the general typography sizing and proportion guidelines seen below. These sizes are intended for keeping proportional hierarchy, alignment, and visual structure in the typography system. It is recommended not to use type that does not adhere to one of these preset styles unless a specific use case should arise for a unique style.
Primary
The primary font of our brand is Baikal. We will use this for all typography, making use of it's variable properties of width, weight, and italics to add variance and style where desired.
Heading H1
Heading H2
Heading H3
Heading H4
Heading H5
Heading H6
Lorem ipsum diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat odio facilisis.
Lorem ipsum diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat odio facilisis.
Lorem ipsum diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat odio facilisis.
Lorem ipsum diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat odio facilisis.
Lorem ipsum diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat odio facilisis.
Visual Style
Iconography
The iconography style for our brand is minimal, clean, and informational.
When used, the icons follow a few simple guidelines:
- We recommend the icons are in the branded accent orange color, paired with dark or light text depending on contrast needs.
- If a new icon is needed, most of the icons were pulled from this library: Carbon Icon Library.
- Other icons were pulled from various libraries on Iconscout.com. If needed, this is possible, but as you can see in the example icons below, at larger sizes, you can see some inconsistencies with line caps and line weights that should try to be avoided. At the size we are using most icons, this won't be very noticeable, just be aware.
Photography
The photography style for our brand is straightforward.
- All SBI images are in black and white.
- All client work is in color. This color makes the focus about them and highlights the end product.
- Our visual identity reflects the value we have in doing our job to make you stand out.
SBI Image Style
Client Image Style
Messaging
We are SBI - a trusted leader in fabrication & logistics solutions
SBI is a leading provider of custom fabrication and logistics solutions for the commercial, retail, hospitality, and luxury brand industries. We work directly with production companies, marketing agencies, general contractors, construction managers, architects, and interior designers to build everything from experiential environments and brand activations to custom millwork and bespoke architectural interiors.