Introduction

Welcome designers, here you'll find everything you need to use Fluid Design System to create ENGIE applications.

Sketch or Figma

The design system is available in Sketch and Figma. We are maintaining both file, so feel free to choose your favorite design tool. (Sketch is only available on Mac)

Sketch

Sketch

Figma

Figma


Fluid guidelines

Be sure to respect our main rules before designing.

Lato is for digital usage only. Please use the Clan-OT for print usage.

Aa
Font-family: Lato
a b c d e f g h i j k l m n o p q r s t u v w x y z
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
0 1 2 3 4 5 6 7 8 9
#0af
#009de9
#ffffff
#0af - #23d2b5
#6ed2b1
#f78a31
#1f106d
#e74a50
#fbdb3c
#009934
#e07602
#c03
#0f1e29
#0b74c0
#2b485c
#005288
#e62b87
#69af23
#007873
#becd00
#910f7d
#552382
#faca08
#0af - #23d2b5

All components are aligned to an 8px square baseline grid for mobile, tablet and desktop. Make sure you have the right parameters in your design tool.

Spacing illustration