Brandbook → Visual identity

Visual identity

The colors, gradients and typography that make up Pluga visual system. The foundation is blue: institutional in Azulasso, expressive in Azul Pavão, deep in Profundíssimo.

Primary palette

Four colors carry the brand. Azulasso takes the institutional role, bringing stability and trust. Azul Pavão brings energy and momentum, and works as the most prominent blue in the system. Profundíssimo adds depth and contrast; Branquíssimo opens up the breathing room.

Profundíssimo

#18003f

COPY

Azulasso

#004dbc

COPY

Azul Pavão

#156cea

COPY

Branquíssimo

#ffffff

COPY

900 #130f58

800 #0a2e8a

700 #053ea3

600 #0859ce

400 #4489ee

300 #78b0f4

200 #bbdaff

100 #d7ebff

Secondary palettes

Three supporting families: the neutral one structures interfaces and text, the functional ones communicate state, and the AI one marks artificial intelligence features in the product.

NEUTRAL

Pretíssimo

#111111

COPY

Cinzasso

#3f4c5e

COPY

Cinzeto

#616f7f

COPY

Cinzinha

#dae3e5

COPY

900 #20252b

800 #303844

600 #4a5869

500 #566374

300 #8996a1

200 #b2bcc3

FUNCTIONAL

Verdasso

#0b5e30

COPY

Verdeto

#189e57

COPY

Verdinho

#78ffbb

COPY

700 #146d42

600 #16854d

400 #18b663

300 #27f088

200 #4ef9a2

Vermelhasso

#b02e20

COPY

Vermelhinho

#ed5462

COPY

Amareluga

#ffdb67

COPY

Profundíssimo

#18003f

COPY

Roxinho

#8365d1

COPY

Rosa K7

#ff9ffa

COPY

IAzul

#4dd1ff

COPY

800 #331964

700 #4e3388

600 #684cad

400 #a274db

300 #c182e5

200 #e091f0

400 #7680dd

300 #689be8

200 #5ab6f3

Gradients

Beyond solid colors, gradients are a supporting resource of the identity. They add depth and momentum to layouts and reinforce the technological read of the brand.

COPY

Pavão → Branquíssimo linear-gradient(90deg, #156cea, #ffffff)

COPY

Profundíssimo → Pavão linear-gradient(100deg, #156cea, #130244, #1a63d8)

COPY

AI linear-gradient(90deg, #5468e8, #a274db, #6b2f80, #18003f)

Typography

Cal Sans v2 is the brand typeface, used across all communication. The GEOM variable axis controls how geometric the letterforms get: GEOM 50 in headings, for maximum personality, and GEOM 25 in body text, where reading comes first.

Cal Sans v2

Headings · font-variation-settings: 'GEOM' 50 · OFL

Automate your tasks

ABCDEFGHIJKLM
abcdefghijklm
0123456789

Cal Sans v2 · text

Body text · font-variation-settings: 'GEOM' 25

Aa Bb Cc Dd 400

Aa Bb Cc Dd 500

Aa Bb Cc Dd 600

Aa Bb Cc Dd 700

CHARACTER SET

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 & @ # % ( ) → ↗ ÁÃÂÀ ÉÊ ÍÓÔÕ ÚÇ