Queralt Style guide

SECTION NAME

1

TABLE OF CONTENTS

01 Brand Basics

03 Logo Do’s and Don’ts

05 Color Palette

07 Typography Basics

09 Website Typograpy

10 Website Graphic Elements

11 Logo Update Recommendation

This style guide is designed to be a simple reference

for everything you need to know about your brand identity.

It’s organized by key areas and laid out in simple spreads

for ease of use. No electricity needed–just the desire to

get things done and look good in the process.

1

BRAND BASICS

Clear Space

80 px

1 inch

SMALLEST FOR WEB

SMALLEST FOR PRINT

2

BRAND BASICS

CLEAR SPACE

The spacing between the Queralt logo and any other

graphic element should always be equal to the logos

x-height (the height of a lowercase x). This is a guaran-

teed way for making sure your logo remains easy to

read and doesn’t get lost alongside other brands.

MINIMUM SIZE

To guarantee legibility the logo should never be smaller

than 1 inch wide in print production or 80px wide on

digital displays. Following these guidelines is especially

important for digital displays since the logos serif’s get

very difficult to read below the 80px threshold.

TECHNICAL DETAILS

Typeface Times New Roman Regular

Small Caps with modified Q

Color Queralt Red

#e74047

C30 M90 Y72 K0

Pantone Coated 52-15C

Clarity and consistency are very important aspects

of building and maintaining a strong brand. These are

some very basic guidelines for making sure your logo

consistently stands out and remains easily recognizable.

3

LOGO DO”S AND DON’TS

In order to maintain consistency over the treatment

of your brand, this section is designed to give you an

overview of proper logo treatments as well as common

mistakes to avoid.

01 STANDARD

This version of the logo will be the

most common, especially in printing.

02 STANDARD ON GREY

This type of application is used on

the website but can also be used in

print pieces.

03 SPECIAL APPLICATION

This type of application should be

used on more special situations like

banners and full bleed pages.

04 OTHER BACKGROUNDS

To mantain consistency, it’s important

that you avoid using other colors in

association with your brand.

05 DON’T USE EFFECTS

Effects like drop shadows take

away from the elegance and the

readability of the logo and should

be avoided.

06 FOCUS ON CLARITY

The current type style in the logo

is very light and makes it difficult to

read over image backdrops. Also,

following this rule should create

some differentiation between the

Queralt brand and it’s satellite

products like iQ3.

07 LAST BUT NOT LEAST

It is probably more obvious than

the other rules, but in no case is it

ever ok to stretch the typography.

It degrades the legibility as well

as the aesthetic appeal that makes

Queralt’s brand unique.

4

LOGO DO”S AND DON’TS

01

02

03 06

07

05

04

5

COLOR PALETTE

Call To Action Blue

Call to action spot color

#00bccc

C71 M0 Y22 K0

Pantone Coated P 121-6C

Call To Action Orange

Call to action spot color

#ffc63d

C0 M22 Y86 K0


Medium Grey

Backgrounds & Special Text

#bdcaca

C26 M13 Y18 K0

Pantone Coated 175-2C

Queralt Dark Grey

Text, Backgrounds, and Graphics

#343a3a

C30 M90 Y72 K0

Pantone Coated 426C

Light Grey

Backgrounds

#dbe3e3

C13 M6 Y8 K0


Ultralight Grey

Backgrounds

#eff5f5

C5 M1 Y2 K0


Queralt Red

Signature Brand Color

#e74047

C30 M90 Y72 K0

PANTONE P 52-15C

6

COLOR PALETTE

01 ALWAYS USE VECTORS IMAGES ( .EPS)

To ensure you get the best print quality, you should

always use vector based files whenever possible to get

fine, non pixelated edges, and the most accurate color

profile.

02 USE PANTONES FOR OFFSET PRINTING

Offset printing is a printing process used for larger

volume print jobs (like magazines and brochures) and

uses pantone spot colors and lithographic plates.

Pantones are the most effective way of getting accurate

color in large print jobs.

03 USE CMYK FOR PROCESS PRINTING

Process printing is used for lower quantity printing and

uses more conventional techniques. When printing in this

way you should use the CMYK color profiles to ensure

the best quality print. CMYK profiles also works best on

normal ink-jet and laser printers.

Given the minimal nature of the logo, color in many

cases, is as essential to the brand as the actual

typography. This section provides all the proper color

profiles for print and web.

7

TYPOGRAPHY BASICS

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp QqRrSsTtUuVvWwXxYyZz0123456789




AaAa

8

TYPOGRAPHY BASICS

LATO | WEBSITE TYPEFACE

Lato is a sanserif typeface family designed in the Summer 2010 by Warsaw

based designer Łukasz Dziedzic. His goals was to create a typeface that

would seem quite “transparent” when used in body text but would display

some original traits when used in larger sizes. He used classical proportions

to give the letter forms familiar harmony and elegance. The semi-rounded

details of the letters give Lato a feeling of warmth, while the strong structure

provides stability and seriousness.

TIMES NEW ROMAN | LOGO TYPEFACE

In 1931, The Times of London commissioned the Monotype Corporation, under

the direction of Stanley Morison, to design a newspaper typeface. The Times,

as a newspaper in a class by itself, needed not a general trade type, however

good, but a face whose strength of line, firmness of contour, and economy of

space fulfilled the specific editorial needs. Times New Roman, drawn by Victor

Lardent and initially released in 1932, is the result.

9

WEBSITE TYPOGRAPY

WEBSITE GUIDELINES

This paragraph text is set at 16 px with a leading of 21px. You have the ability to highlight import-ant information and links in this text by applying the black weight (one weight heavier than bold.)

Lato Regular 32px/40pxH1

H2

H3

H4

P

Lato Regular 32px/40px

LATO REGULAR 14PX/18PX

LATO REGULAR 14 PX/ 18PX

10

WEBSITE GRAPHIC ELEMENTS

Special Headline Text with a red bar.

40%

Small Vector Graphics

Queralt Dark Grey and white

01 02 03

Medium Sized Icon Based

Queralt Red and white

Infographic/Large Illustrations

Full grey color palette and Queralt

Red as a spot color

11

UPDATE RECOMMENDATION

Queralt

RECOMMENDATION 1

Humanistic, Friendly , Modern

12

UPDATE RECOMMENDATION

Queralt

RECOMMENDATION 2

Stearn, Mature, Elegant

Documents

Queralt Style guide