Charte graphique
Le logo, les icônes, les couleurs et la typographie d'OVOKY, et la bonne façon de les utiliser. Chaque valeur de cette page est fixe et identique à celle du site.
Logo
Trois déclinaisons
Le logotype se compose de cinq glyphes géométriques. Gardez une zone de protection de 0,4 × la hauteur du logo de chaque côté, et ne l'affichez jamais à moins de 72 px de large.
Zone de protection
Le carré grisé mesure 0,4 × la hauteur du logo.
À éviter
- Recolorer le logotype en dehors des trois déclinaisons
- Placer le logo Sky sur un fond blanc ou clair
- Ajouter des ombres, contours ou dégradés au logotype
- Étirer, faire pivoter ou recomposer le logo avec une police
Icône d'application
Le symbole sur un dégradé
Le premier glyphe seul, centré, à un tiers de la largeur de l'icône, sur un dégradé vertical à deux couleurs. Le bleu est la version par défaut.
Couleurs
Deux familles en miroir
Le bleu et le vert vont chacun d'une teinte pâle à une nuance profonde. Les neutres tirent vers le marine. Sky et Mint sont réservés aux fonds sombres.
Rose et prune (marque)
- #050003
Nuit
Hero, pied de page, scène 3D
- #1F0D25
Prune
Bandeaux et cartes sombres
- #911D6E
Ruban
Rubans, aplats rose profond
- #FF488B
Rose
Boutons principaux, accents sur fond sombre
- #D6176A
Baie
Liens, chiffres, texte rose sur fond clair
- #FF9EC9
Lueur
Texte rose sur fond sombre
- #FBE4EE
Blush
Puces, badges, boutons discrets
Neutres (teintés prune)
- #1C0D22
Encre
Texte courant, boutons pleins
- #6A5870
Atténué
Texte secondaire
- #E6D8E3
Trait
Bordures
- #F9F2F6
Papier 2
Fond de section
- #FDFBFC
Papier
Fond de page
Bleu (produit, secondaire)
- #CCEEFF
Glace
Maquettes produit
- #33BBFF
Sky
Déclinaison principale du logo
- #006699
Océan
Maquettes produit
- #004466
Marine
Maquettes produit
Vert (produit, secondaire)
- #CCFFEE
Écume
Maquettes produit
- #33FFBB
Mint
Statuts dans les maquettes
- #009966
Émeraude
Statuts dans les maquettes
Bleu profond
#006699 → #004466
Vert profond
#009966 → #006644
Voile
Fonds de hero et de mise en avant
Accent de titre
Océan → émeraude sur fond clair
Typographie
Google Sans
Google Sans pour les titres et le texte, Google Sans Code pour les libellés. Titres en gras, interlettrage serré, majuscule au premier mot seulement.
Display · Google Sans Bold
Appelez plus, sans finir en spam
Titre de section · display-2
Un vrai accueil pour chaque appel
Texte · Google Sans Regular 17 px
La fiche client s'affiche avant même le « allô ». Notes, rappels, e-mails et SMS rejoignent tous le même historique.
Libellé · Google Sans Code SemiBold, majuscules
Numéroteur prédictif · En direct · 32 rapports
Interface
Boutons et libellés
Actions principales en marine, actions d'accent en mint avec texte encre, actions secondaires en contour. Un seul bouton principal par vue.
- Encre sur papier pour le texte courant ; océan pour les liens (6,2:1)
- Émeraude pour les icônes et les grands textes ; forêt pour les petits textes verts
- Sky et mint uniquement sur marine ou encre
Besoin d'autre chose pour la presse ou vos partenaires ?
Écrivez-nous et nous vous enverrons les fichiers ou les consignes dont vous avez besoin.