Creative Giants
Affiche éditoriale grand format sur papier crème
Creative Giants ressemble à une double page de livre d'art grand format, rendue par le code: une toile chaude et crémeuse, des marges fines et une typographie si imposante qu'elle évoque davantage une affiche qu'un titre. L'ensemble du système repose sur l'espace négatif et une taille unique et légère (300): les titres sont à peine audibles entre 64 et 84 px, au lieu d'être mis en valeur par le gras, et l'espacement des lettres diminue fortement (-0,04 em) à mesure que la taille de la police augmente, donnant aux mots un aspect ciselé plutôt que décollé. La palette de couleurs est répartie par petites touches saturées: violet vif, turquoise profond, bleu clair, rose fuchsia, menthe et bleu marine apparaissent en surface ou en accents, plutôt qu'en fond. Les éléments interactifs sont des formes noires sur fond crème aux rayons parfaitement arrondis (1440 px), tandis que les éléments chromés sont presque invisibles: un logo rond et le bouton « Menu» flottent dans l'espace blanc. Le concept visuel s'inspire d'une planche-contact de studio de production: un titre immense, une photo pleine largeur et une ligne de texte discrète. Une page sur deux devrait adopter le même style laconique.
Mise en page plein écran: aucun conteneur de largeur maximale n’est défini; le contenu occupe toute la largeur de la page avec des marges égales à gauche et à droite (16 à 32 px sur mobile, plus de 32 px sur ordinateur). Le titre principal est un unique et grand titre (« GÉANTS DE LA CRÉATION» à 84 px) occupant environ 40 % de la fenêtre, immédiatement suivi d’une photo plein écran avec une balise méta dans le coin inférieur gauche et un titre superposé. Le rythme des sections est monolithique: chaque nouvelle section commence par un court texte en majuscules et une explication, séparés par un espace blanc de 48 à 64 px. Il n’y a pas d’alternance de bandes claires et foncées, à l’exception d’une carte d’accentuation bleu marine inversée. Le contenu est aligné à gauche; il n’y a pas de blocs centrés, à l’exception du titre principal. La section Actualités/Études de cas utilise une grille de cartes à trois colonnes avec un bloc de flèche flottant à droite. La navigation s’effectue via un seul bandeau supérieur, sans barre latérale ni éléments ancrés. La mise en page générale est aérée et cohérente avec le style éditorial: chaque section respire et l’espace blanc constitue l’élément structurel principal.
La photographie éditoriale domine le design: les images occupent toute la largeur de la page, avec des angles nets, sans chevauchement ni flou. Le style se veut documentaire et atmosphérique – mains ridées, installations publiques et portraits spontanés – sans jamais recourir à la photographie de produits mise en scène. Les images sont toujours présentées en grand format (pleine largeur ou occupant toute la carte), l’élément central du design étant la photographie et non l’interface utilisateur. On ne trouve ni illustrations, ni modèles 3D, ni maquettes de produits. L’iconographie est minimaliste: un petit logo circulaire, des chevrons en contour sur les commandes du carrousel et des icônes d’interface utilisateur légères avec un contour de 1 px. La densité d’images est déterminée par l’image elle-même, et le texte sert de couche d’annotation discrète, placée au-dessus ou en dessous de la photographie.
Palette
Marque
- Magenta Bloom
#8a0467— Le rose est utilisé comme couleur d'accent secondaire pour les détails décoratifs et pour mettre en évidence les requêtes de recherche moins fréquentes. Il ne doit pas être utilisé comme couleur principale pour un appel à l'action. - Forest Teal
#03624c— Une couleur d'accent riche, idéale pour les cadres de cartes et les touches décoratives; s'associe à Magenta Bloom pour un fini bicolore.
Neutre
- Bone White
#fffef7— La toile de la page, les surfaces en carton et le texte sur des accents foncés présentent une teinte chaude et crémeuse qui remplace le noir pur et donne à l'ensemble du système un aspect papier imprimé. - Ink Black
#000000— Les couleurs foncées mettent en valeur les textes et icônes neutres et créent un contraste marqué. Évitez de les utiliser comme couleur principale pour les appels à l'action. - Graphite
#666666— Le texte secondaire, les légendes, les métadonnées et les textes d'accompagnement sont relégués à l'arrière-plan pour laisser la place au texte principal. - Ash
#aaaaaa— Bordures des champs de saisie, couleur des liens inactifs, séparateurs tertiaires: une couleur grise structurelle discrète qui disparaît lorsqu’elle n’est pas nécessaire. - Charcoal Scale
#4d4c4a— Une teinte neutre moyenne pour les bordures de la liste, avec un léger renforcement du contraste sur le dégradé foncé – gris chaud plutôt que gris bleuté. - Powder Blue
#a5c8eb— Une touche de couleur douce — fonds de carte postale, arrière-plans flous, illustrations aux tons discrets — rafraîchit un fond chaud sans créer de concurrence.
Typographie
de 12 à 84 px · 7 étapes
- Switzer — remplacement: Inter (300 · grandes lignes 300, 400 · Un système de police unique: graisse 300 pour tous les éléments d’affichage et les titres (12–84 px), graisse 400 pour le corps du texte, les métadonnées et les commandes d’interface. L’option privilégiée est l’utilisation de la graisse 300 pour les tailles de 64 à 84 px; la plupart des systèmes utilisent une police grasse de 700 à 800 dans ces tailles. La police Switzer, aux tons clairs, conserve des traits fins, donnant l’impression d’un effet aérographe sur un fond crème. Un espacement plus serré entre les lettres à mesure que la taille augmente (-0,04 em à 84 px, -0,018 em à 14 px) préserve la lisibilité sans créer une impression de surcharge.
Intervalles et forme
| But | Signification |
|---|---|
| Densité | moyenne |
| Étape de base | 8px |
| Rayon du bouton | 1440px |
| Rayon de la carte | 0px |
| Ombres | non - des bordures à la place des ombres |
| Entre les sections | 64px |
L'IA construira votre site web dans le style Creative Giants et le remplira.
- Partagez vos produits et publications via le lien - Instagram, TikTok, Facebook.
- Transférez le contenu de votre ancien site: il vous suffit de préciser l’adresse.
- Conception moderne sur le meilleur moteur: React ( Next.js) avec rendu côté serveur et optimisation SEO intégrée.
- Optimisation SEO entièrement automatisée pour les résultats de recherche et recommandations de réseaux neuronaux.
Styles similaires
- ElevenLabs — Un reportage photo aux tons crème chauds, avec des titres discrets. Un carnet de style Bauhaus: papier couleur coquille d’œuf, encre noire et une touche de violet et d’orange pour la présentation du produit.
- monopo saigon — Une lueur liquide et irisée derrière le silence éditorial — une galerie éditoriale monochrome flottant sur une lumière en fusion
- Awesomic — Grille éditoriale en zinc avec des signes de ponctuation orange évoquant des confettis
- Monad — revue technique éditoriale sur parchemin chaud
- Dub — Panneau de commande en papier de riz mat de Link
- Seline Analytics — Un tableau analytique silencieux sur du papier chaud
- Notion — Un carnet en papier chaud sous le soleil de midi
- Hyer Aviation — Au crépuscule, le ciel pâle de l'aube se fond dans le cockpit, tandis que le logo à empattements, de la taille du fuselage, se mêle à la pâleur du ciel. Une unique touche de couleur argile chaude vient rompre la monotonie monochrome.
- Anthropic — Un journal de terrain scientifique sur vélin aux tons chauds — des surfaces ivoire apaisantes, des titres éditoriaux à empattements et une unique touche d'argile qui n'apparaît que lorsque l'action est nécessaire.
- Calendly — Encre bleu foncé sur marbre froid
- Augen Pro — La présentation blanche d'Apple met en valeur un bleu électrique clinique et aérien comme unique accent dans un espace monochrome.
- OFF+BRAND. — Sphère irisée sur parchemin chaud