Charte graphique · Web

Identité visuelle du Parti libéral du Québec

Le système visuel du Parti libéral du Québec : logo, déclinaisons, couleurs et typographie.

Police Gilroy Bleu #0079C2 Rouge #EB1F2F
02 · Déclinaisons

Déclinaisons

Quatre versions couvrent tous les fonds. On choisit toujours celle qui garantit le meilleur contraste sur une couleur à plat.

Couleur / fond clair
Renversé blanc / fond rouge
Renversé blanc / fond foncé
Monochrome noir
Ajout web. Une version monochrome bleu (#0079C2) est tolérée pour les usages d'interface (filigranes, pictos d'en-tête) où une seule couleur est requise. Le rouge ne sert jamais de couleur unique pour le logo.
Icône, formats numériques
Avatar couleur
Avatar fond bleu
Favicon 40px
16-24px
03 · Zone de protection

Zone de protection

Afin d'en maximiser l'impact, l'icône et le logo sont toujours entourés d'un espace de protection. C'est à la fois une zone vierge de tout élément et la distance minimale à respecter en bordure du support.

1x1x

Règle. On définit une unité x égale à la hauteur de la feuille rouge de l'icône. La zone de dégagement minimale est de 1x sur les quatre côtés (zone pointillée).

Pour le web. Réserver au moins 24px de marge autour du logo dans un en-tête, et davantage en pied de page. Ne jamais laisser un autre élément (texte, bouton, photo) empiéter sur cette zone.

04 · Tailles minimales

Tailles minimales

Sous ces seuils, la lisibilité de la signature se dégrade.

Logo complet, web
120 px

Largeur minimale à l'écran.

Icône seule, web
24 px

Favicon 16 et 32 px en versions dédiées.

Logo complet, imprimé
30 mm

Largeur minimale sur support papier.

05 · À ne pas faire

À ne pas faire

L'intégrité du logo est non négociable. Voici les altérations interdites.

Modifier les couleurs
Convertir en niveaux de gris
Poser sur un fond chargé
Ajouter une ombre portée
Déformer les proportions
Faire pivoter le logo
Parti Libéral
du QuébecChanger la police de la signature
Recolorer hors charte
06 · Couleurs

Couleurs

Deux couleurs portent la marque. Le système web ajoute des nuances calibrées et des neutres pour couvrir tous les besoins d'une interface.

Cliquez sur n'importe quelle couleur pour copier son code en un clic.

Couleurs primaires
AA texte
Bleu PLQ
#0079C2 · rgb(0 121 194) · cmjn ~100/38/0/24
Accent
Rouge PLQ
#EB1F2F · rgb(235 31 47) · cmjn ~0/87/80/8
Nuancier bleu
#EBF4FA
#D6EAF5
#A8D1EA
#73B5DD
#3896CF
#0079C2
#0066A3
#005284
#003F65
#002E4A
Nuancier rouge
#FDEDEE
#FCDBDE
#F8B3B8
#F4848D
#EF505D
#EB1F2F
#C51A27
#A01520
#7A1018
#590C12
Neutres
#FFFFFF
Blanc
Fonds, respiration
#F7F8FA
Papier
Fond de page
#E2E6EC
Gris 200
Bordures, séparateurs
#9AA4B2
Gris 400
Texte désactivé
#5B6675
Ardoise
Texte secondaire
#16243A
Encre
Texte principal
Répartition recommandée (60 / 30 / 10)
60% Clair (blanc, papier)
30% Bleu (structure)
10% Rouge

Le blanc domine pour la clarté, le bleu structure l'interface (en-tête, liens, boutons principaux), le rouge reste un accent rare réservé aux appels à l'action forts (« Je donne ») et aux moments d'énergie.

07 · Typographie

Typographie

La marque utilise une seule famille, Gilroy, un sans serif géométrique. C'est l'unique police de toutes les communications.

Gilroy est une police commerciale : en production, on recommande de l'auto-héberger.
Graisses & usages
Aa
Black 900 · Titres, slogans
Aa
Extrabold/Heavy 800 · Grands titres
Aa
Bold 700 · Intertitres, boutons
Aa
Medium 500 · Navigation, sous-titres
Aa
Regular 400 · Corps de texte
Aa
Italic · Emphase, citations, slogans
Adaptation web. La charte imprimée pose les titres, intertitres et corps en italique. Sur le web, on garde le romain pour les titres d'interface et le corps (lisibilité, conventions de lecture) et on réserve l'italique aux slogans, accroches et citations.
Échelle typographique (base 16px, ratio 1.25)
Display · 61px/900Le Québec d'abord
H1 · 49px/900Une équipe renouvelée
H2 · 39px/800Nos priorités
H3 · 31px/800Économie et régions
H4 · 25px/700Services publics
Corps L · 18px/400Texte d'introduction, légèrement plus grand pour les chapôs et la mise en avant.
Corps · 16px/400Corps de texte courant des pages et des articles, lisible et confortable sur tous les écrans.
Petit · 14px/400Légendes, métadonnées, mentions légales et notes secondaires.
Pourquoi le ratio 1,25 ? C'est la « tierce majeure » des échelles modulaires : chaque cran est multiplié par 1,25 à partir de la base de 16 px (16 → 25 → 31 → 39 → 49 → 61). Ce ratio offre une hiérarchie claire entre les niveaux sans écarts trop brutaux, ce qui le rend confortable et lisible sur le web. Le Corps L à 18 px est un palier intermédiaire volontaire, hors échelle, réservé aux chapôs.
08 · Slogan principal et réseaux sociaux

Slogan principal et réseaux sociaux

Slogan principal

Régionaliste. Nationaliste. Fédéraliste.

Réseaux sociaux (à jour)

Facebook : /LiberalQuebec
X : @LiberalQuebec
Instagram : @liberalquebec
YouTube : /PartiLiberalduQuebec
TikTok : @liberalqc

* En anglais, le parti est QLP (Quebec Liberal Party) ; la Commission-Jeunesse devient « Youth Commission ».