Version : 1.0
Création : 23 août 2026
Dernière mise à jour : 23 août 2026
Objectif
La charte graphique de Simple ITec Astuces a pour objectif de construire une identité visuelle simple, moderne et facilement identifiable, utilisable aussi bien sur le site Internet que sur des documents, des applications, des réseaux sociaux ou de futurs projets.
L’identité doit respecter quatre principes :
- simplicité ;
- lisibilité;
- cohérence;
- évolutivité.
Simple ITec doit pouvoir conserver son identité principale tout en étant décliné facilement pour différentes activités.
La première déclinaison est :
« Simple ITec Astuces » ou « Simple ITec 360«
Le site est actuellement organisé autour de quatre domaines :
- Informatique;
- Maison;
- Énergie;
- Vie pratique.
Logo principal Simple ITec
Le logo historique constitue la base de toute l’identité graphique.
Il est composé de deux éléments :
Symbole
Le monogramme Si constitue l’élément graphique principal.
Il est formé :
- d’un
Santhracite / bleu nuit ; - d’un
ibleu ; - d’un petit carré bleu placé devant le
S; - d’un second carré bleu formant le point du
i.
Ce symbole doit pouvoir être utilisé indépendamment du nom Simple ITec.
Il devient notamment :
- favicon ;
- icône d’application ;
- avatar ;
- icône de profil ;
- signature graphique compacte.
Nom
Le nom est écrit :
« Simple ITec«
La partie Simple reste sombre.
Le I de ITec est utilisé comme élément d’accentuation bleu.
L’ensemble doit conserver une apparence sobre et technologique, sans multiplier les effets graphiques.
Déclinaison Simple ITec Astuces
Pour le site d’astuces, l’identité principale devient :
Simple ITec
ASTUCES
Le terme ASTUCES est placé sous le nom principal et doit rester visuellement secondaire.
La signature complète peut également faire apparaître les quatre domaines :
Informatique • Maison • Énergie • Vie pratique
Cette version est destinée principalement :
- à la page d’accueil ;
- aux documents ;
- aux présentations ;
- aux communications institutionnelles.
Pour les espaces réduits, elle doit être simplifiée.
Versions officielles du logo
Plusieurs versions doivent être conservées.
Version horizontale
Utilisation principale :
[Si] Simple ITec Astuces
Elle est destinée :
- au site Internet ;
- aux en-têtes ;
- aux documents ;
- aux présentations ;
- aux signatures.
Version empilée
Le symbole apparaît au-dessus du nom.
Elle est adaptée :
- aux formats carrés ;
- aux couvertures ;
- aux affiches ;
- aux présentations ;
- aux publications sociales.
Version compacte
Elle comprend :
[Si] Simple ITec
ou :
[Si] Simple ITec Astuces
Elle est utilisée lorsque la hauteur disponible est faible.
Symbole seul
Le monogramme Si peut être utilisé sans texte.
Il est destiné :
- aux favicons ;
- aux applications ;
- aux raccourcis ;
- aux avatars ;
- aux boutons ;
- aux petits supports.
Palette principale
La palette doit rester limitée.
Bleu nuit
Couleur principale du texte et du symbole.
Usage :
- texte ;
- logo ;
- navigation ;
- fonds sombres.
Valeur de travail :
#0B1320
Bleu Simple ITec
Couleur technologique principale.
Usage :
idu symbole ;Ide ITec ;- liens ;
- boutons ;
- éléments interactifs.
Valeur de travail :
#2563EB
Blanc
#FFFFFF
Utilisé comme fond principal.
Gris très clair
Valeur de travail :
#F5F6F8
Utilisé pour :
- cartes ;
- séparations ;
- zones secondaires.
Les valeurs définitives devront être relevées directement depuis le logo maître dans Inkscape afin de garantir une parfaite cohérence entre tous les fichiers.
Couleurs des quatre rubriques
L’identité Simple ITec reste dominante.
Les rubriques disposent seulement d’une couleur d’accent.
Informatique
Bleu
Valeur indicative :
#2563EB
Utilisation :
- pictogramme ordinateur ;
- petites lignes ;
- pastilles ;
- badges.
Maison
Vert
Valeur indicative :
#22C55E
Utilisation :
- pictogramme maison ;
- pastilles ;
- éléments de rubrique.
Énergie
Orange
Valeur indicative :
#F59E0B
Utilisation :
- solaire ;
- énergie ;
- production ;
- consommation.
Vie pratique
Turquoise
Valeur indicative :
#14B8A6
Utilisation :
- ampoule ;
- idées ;
- conseils ;
- organisation.
Les couleurs des rubriques ne doivent pas remplacer les couleurs principales Simple ITec.
Elles servent uniquement de repères visuels.
Icônes des rubriques
Chaque domaine possède un pictogramme simple.
Informatique
Ordinateur portable.
Maison
Maison stylisée.
Énergie
Panneau solaire et soleil.
Vie pratique
Ampoule.
Les pictogrammes doivent utiliser :
- un trait homogène ;
- peu de détails ;
- aucune ombre obligatoire ;
- aucune photographie ;
- une excellente lisibilité même en petite taille.
Ils devront être disponibles au minimum en :
- SVG ;
- PNG transparent.
Icône d’application
Deux versions sont prévues.
Fond clair
Fond blanc ou gris très clair.
Monogramme :
- S bleu nuit ;
- i bleu ;
- carrés bleus.
Fond foncé
Fond bleu nuit.
Monogramme :
- S blanc ;
- i bleu ;
- carrés bleus.
Formats principaux :
- 1024 × 1024 px ;
- 512 × 512 px ;
- 256 × 256 px ;
- 180 × 180 px.
Le symbole doit conserver suffisamment d’espace autour de lui.
Favicon
Le favicon utilise uniquement le monogramme Si.
Le texte Simple ITec et le mot Astuces sont supprimés car ils deviennent illisibles à petite taille.
Tailles prévues :
- 512 × 512 ;
- 256 × 256 ;
- 180 × 180 ;
- 96 × 96 ;
- 48 × 48 ;
- 32 × 32 ;
- 16 × 16.
Un fichier :
favicon.ico
doit regrouper plusieurs résolutions.
Pour WordPress, l’image source principale sera idéalement une image carrée de 512 × 512 px.
Version sur fond sombre
Une version spécifique du logo est utilisée sur un fond bleu nuit.
Elle comprend :
- symbole
Sblanc ; ibleu ;- texte principal blanc ;
- éléments d’accentuation bleus.
Cette version ne doit pas être obtenue en inversant automatiquement les couleurs.
Elle constitue une variante officielle indépendante.
Typographie
L’identité recherche une typographie :
- moderne ;
- neutre ;
- très lisible ;
- adaptée aux écrans.
Pour le site, Manrope constitue une bonne base si elle est disponible dans WordPress.
Une police système ou une police compatible pourra être utilisée pour les documents.
Les niveaux typographiques doivent être peu nombreux :
Titre principal
Fort et très lisible.
Titres de sections
Hiérarchisation H2 et H3.
Texte courant
Lecture confortable sur smartphone.
Informations secondaires
Taille plus petite, sans sacrifier la lisibilité.
Règles d’utilisation du logo
Le logo ne doit pas être :
- étiré ;
- compressé ;
- incliné ;
- recoloré arbitrairement ;
- entouré d’effets ;
- placé sur une photographie trop chargée.
Une zone de sécurité doit être conservée autour du logo.
Comme référence, cette marge peut correspondre approximativement à la hauteur du carré constituant le point du i.
Formats de fichiers à conserver
Le fichier maître est créé dans Inkscape.
SVG
Format principal.
Utilisations :
- Web ;
- impression ;
- modifications futures ;
- documents haute résolution.
Les fichiers SVG constituent les fichiers maîtres à conserver.
PNG
Utilisé pour :
- WordPress ;
- bureautique ;
- applications ;
- logiciels ne gérant pas le SVG.
Les PNG doivent être exportés avec transparence lorsqu’aucun fond particulier n’est requis.
ICO
Utilisé principalement pour :
- favicon ;
- raccourcis Windows ;
- certaines applications.
Arborescence des fichiers graphiques
Organisation recommandée :
Simple-ITec/
01-Logo/
- Logo-Simple-ITec.svg
- Logo-Simple-ITec.png
- Logo-Simple-ITec-Astuces.svg
- Logo-Simple-ITec-Astuces.png
- Logo-Simple-ITec-Astuces-Sombre.svg
02-Symbole/
- Simple-ITec-Si.svg
- Simple-ITec-Si.png
- Simple-ITec-Si-Sombre.svg
03-Favicons/
- favicon-512.png
- favicon-256.png
- favicon-180.png
- favicon-96.png
- favicon-48.png
- favicon-32.png
- favicon-16.png
- favicon.ico
04-Icones-rubriques/
- Informatique.svg
- Maison.svg
- Energie.svg
- Vie-Pratique.svg
05-Documents/
- Entete-document.svg
- Papier-a-lettre.svg
- Signature.svg
06-Reseaux-sociaux/
- Avatar.svg
- Avatar.png
- Profil-clair.png
- Profil-sombre.png
- Banniere-claire.png
- Banniere-sombre.png
Principe d’évolution
La charte graphique n’est pas considérée comme figée.
Elle doit évoluer progressivement sans perdre son identité.
Chaque changement important doit être documenté.
Exemple :
Version 1.0 — 23 août 2026
- création de l’identité Simple ITec Astuces ;
- conservation du logo Simple ITec original ;
- création des quatre rubriques ;
- définition des couleurs ;
- définition du favicon ;
- définition des premières déclinaisons.
Évolutions prévues
- finalisation des fichiers maîtres Inkscape ;
- validation définitive des codes couleur ;
- création des modèles de documents ;
- création des modèles réseaux sociaux ;
- définition précise des marges et dimensions du logo ;
- éventuelles nouvelles déclinaisons Simple ITec.
Conclusion
L’objectif de cette identité est volontairement simple :
une marque principale forte, Simple ITec, et des déclinaisons suffisamment souples pour accompagner différents projets sans recréer une nouvelle identité à chaque fois.
La priorité reste la lisibilité, la simplicité et la cohérence entre tous les supports.
Charte graphique résumé – version 1:
Charte graphique résumé – version 2:
Charte graphique – Système de sous-marques:
