Le Puzz

Palette

Marque

• Honeycomb Yellow #ffd931 — La couleur principale de la marque, la barre de titre, les boutons d'action principaux, l'état actif de la navigation, la couleur de soulignement des liens, la couleur de remplissage accentuée — la note de couleur unique autour de laquelle tout le reste s'articule.

Neutre

• Carbon Black #000000 — Le texte principal, les bordures épaisses, les contours des boutons, les contours des icônes et le texte de navigation constituent la base structurelle de l'ensemble du système.
• Ink Black #231f20 — Texte secondaire, texte principal, bordures des boutons, bordures des champs de saisie: une couleur légèrement plus chaude, presque noire, pour une impression de douceur.
• Pearl Gray #c8cbcd — Toile de page, arrière-plans de fiches produits, une scène saisissante où apparaissent les couleurs jaune et noire.
• Fog Gray #a6a8aa — Surfaces de badge discrètes, arrière-plans de puces secondaires et remplissages d'interface utilisateur subtils.
• Smoke Line #d6d6d6 — Séparateurs fins, séparateurs discrets pour tables/cartes.

Typographie

de 11 à 47 px · 6 étapes

• Times Now — remplacement: Playfair Display · grandes lignes 100, 400 · Police à empattements pour titres et sous-titres: utilisée pour les titres principaux, les noms de produits et les titres de section. Cette police ultra-légère de 100 points avec un espacement de 47 pixels confère une impression de hauteur et de concision, idéale pour les textes de type éditorial. La concision des caractères (hauteur de ligne de 0,87 à 0,90) permet de placer les grands titres près du texte, à la manière d’une affiche imprimée.
• Times — remplacement: Times New Roman · grandes lignes 400 · Le choix d'une police à empattements pour le corps du texte est inattendu pour une boutique en ligne, conférant au site une allure littéraire, presque de catalogue. L'interligne réduit (1,15) rend les paragraphes compacts et lisibles.
• Helvetica Neue — remplacement: Helvetica · grandes lignes 100, 400 · Les petits textes de l'interface utilisateur, les textes des boutons et les microtextes sont définis dans une police de 11 px avec un grand espacement entre les lettres (0,0730 em), ce qui donne l'impression d'écrire en lettres majuscules même à une température corporelle confortable.

Intervalles et forme

Styles similaires

• Agence Foudre — La couverture du magazine est d'un rose tendre qui rappelle celui du rouge à lèvres.
• INVERSA — Un terminal topographique à minuit. Un panneau de commande sombre, où une police de caractères massive et une seule couche de marqueurs vert fluo sont superposées à des images satellites de la Terre, chaque étiquette monochrome, comme s'il s'agissait de coordonnées de mission.
• Acne Studios — Un espace d'exposition minimaliste rempli de photographies éclatantes – un magazine de mode disposé sur du marbre
• GTE — Terminal de transactions derrière l'éclairage de la galerie
• Diabla — Une cour méditerranéenne à midi – des murs roses délavés par le soleil, un auvent en toile rouge vif et des titres de journaux à empattements qui s'étendent dans le ciel.
• Subset — Boutique éditoriale en lin brut
• Cursor — Un atelier de parchemin chaleureux, éclairé par des braises incandescentes.
• MindMarket — Un livre de contes de fées douillet sur papier crème – une toile éditoriale conviviale où de grands titres d'Inter et des personnages en papier découpé coexistent sur une surface douce comme un autocollant, baignée de soleil.
• Lamborghini — Une voiture jaune, couleur noire, exposée dans la salle d'exposition sous les projecteurs.
• Amplemarket — Un lieu de travail baigné de soleil et jonché de confettis
• Getharvest — Un bureau à l'heure dorée – une toile couleur crème chaude, des cartes postales blanches accrochées à la toile et une unique flamme orange vif.
• Drive Capital — Affiche rétro de road trip sur papier chaud