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.
ElevenLabs adopte un style minimaliste blanc chaleureux: une toile couleur coquille d’œuf (#fdfcfc) avec des caractères noirs et une seule couche de surfaces taupe chaudes (#f5f3f1). L’identité de marque est discrète et affirmée: la police Waldenburg 300, à peine lisible, met en valeur les titres avec une extrême clarté (-0,02 em), tandis que l’Inter 400/500 confère au reste une neutralité sereine. Deux couleurs d’accent – un violet vibrant (#0447ff) et un orange vif (#ff4704) – apparaissent uniquement dans les éléments visuels du produit (audiosphères, icônes), jamais sous forme de chrome dans l’interface utilisateur. Les composants restent plats ou légèrement en relief, avec des bordures fines de 1 px, des rayons de 20 px pour les cartes et des boutons de 9 999 px. Le système évoque un atelier Bauhaus sur du papier crème: sobre, éditorial et d’une grande précision technique.
Les sections pleine largeur sont disposées verticalement dans une unique colonne centrale de largeur maximale, avec des gouttières extérieures de 1280 px. La section principale est asymétrique: le titre est aligné à gauche (niveau Waldenburg de 48 px), le texte descriptif est aligné à droite et deux boutons en forme de pilule sont situés en dessous du titre. Sous la section principale se trouve une large barre de navigation à onglets qui s’étend sur toute la largeur du contenu. Les sections alternent entre des fonds couleur coquille d’œuf et taupe, avec des gouttières verticales de 96 à 125 px. Le pied de page est une bande unique et compacte. La navigation est une barre supérieure minimaliste: pas de comportement fixe, pas de méga-menus. Le rythme du contenu correspond au style éditorial: beaucoup d’espace blanc, un élément visuel principal par section et aucune grille de cartes sous la section « Confiance».
Le design visuel est dominé par une palette de couleurs: de larges dégradés, sous forme de sphères sonores douces (cercles de plus de 200 px avec des transitions radiales du violet à l’orange et au rose), constituent l’élément graphique principal. Les logos de la section « Confiance» sont présentés en niveaux de gris à faible contraste sur un fond mat. La photographie est minimaliste: aucune photo de style de vie ni de produit. L’iconographie est épurée et monochrome (icônes noires, contour ou remplissage, aucune icône colorée). Le système visuel évoque davantage une publication de design qu’un catalogue de produits: la sobriété éditoriale prime sur l’impact marketing.
Palette
Marque
- Violet Spark
#0447ff— Mise en valeur visuelle du produit - Apparaît uniquement dans les illustrations de la sphère audio et les icônes décoratives du produit; jamais utilisée pour les éléments d'interface.
Neutre
- Eggshell
#fdfcfc— La surface des pages, des boutons et des cartes est chaude, légèrement crémeuse, plutôt que d'un blanc éclatant, afin d'éviter les reflets numériques et de donner au site le calme du papier. - Warm Taupe
#f5f3f1— Des bandes de séparation, des cartes décoratives et une surface supplémentaire – légèrement plus épaisse que la surface mate – créent une séparation discrète et sans bordure. - Stone
#ebe8e4— Les bordures fines, les séparateurs et les fonds d'icônes sont d'un gris chaud, entre le taupe et le gris moyen, sans paraître froids. - Ink
#000000— Qu'il s'agisse du texte principal, des boutons remplis, de la navigation ou des liens, le noir pur sert de base à une palette de couleurs chaudes et crée le seul contraste net du système. - Graphite
#44403b— Texte principal, titres de section: un gris foncé chaud et subtil pour un texte qui doit être percutant sans la dureté du noir. - Smoke
#777169— Le texte principal, les descriptions discrètes et les légendes sont d'un gris chaud moyen; le style dominant, lisible et pourtant calme des cartes et des textes thématiques.
Typographie
de 10 à 48 px · 8 étapes
- Waldenburg — remplacement: Inter (300) or Söhne Light · grandes lignes 300 · Pour les titres et éléments graphiques uniquement. Utilisée aux formats 48/36/32 px avec une graisse de 300 — une police ultra-légère, peu courante (la plupart des sites web utilisent 600-700); cette police discrète confère une impression d’autorité par sa sobriété. Un espacement réduit de -0,02 em entre les lettres assure un meilleur rendu, même aux grandes tailles. Alternatives: « Inter» en graisse 300 ou « Söhne» en version légère pour une option haut de gamme.
- Inter — remplacement: Inter or system-ui · grandes lignes 400, 500 · Tout ce qui se trouve hors écran: texte courant, navigation, boutons, liens, étiquettes, champs de saisie, cartes. La graisse par défaut est de 400; 500 est réservée aux boutons et aux liens mis en évidence. Les tailles varient de 10 à 10, avec un interligne réduit (1,47 à 1,6) pour une meilleure lisibilité des paragraphes. Un espacement de +1 (2) pour les petites lettres, de 14 à 3, améliore la lisibilité en petits caractères.
- Geist Mono — remplacement: JetBrains Mono or IBM Plex Mono · grandes lignes 400 · Microtexte placé à côté du code ou du texte technique, positionné à 13 px — rarement utilisé (fréquence = 28) pour les étiquettes techniques ou les métadonnées. Calque unique, interligne important de 1,69.
Intervalles et forme
| But | Signification |
|---|---|
| Densité | dense |
| Étape de base | 8-16px |
| Rayon du bouton | 9999px |
| Rayon de la carte | 20px |
| Ombres | non - des bordures à la place des ombres |
| Entre les sections | 96-125px |
| Largeur de la page | 1280px |
L'IA construira votre site web dans le style ElevenLabs 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
- 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
- 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.
- Antimetal — Chronique éditoriale sur papier crème – une matinée paisible dans une revue scientifique, où la sobriété inspire confiance et où les empattements font tout le travail.
- Perk — Chaux électrique sur papier sulfurisé chaud
- Ditto — Un atelier baigné de soleil, où sont créés des échantillons de fleurs sauvages. Des surfaces crème chaudes, une base jaune éclatante, des encres bleu marine profond, des formes organiques aux couleurs chatoyantes qui s'épanouissent en arrière-plan.
- Officevibe — Un magazine éditorial imprimé sur un papier couleur crème chaleureuse. Imaginez un essai approfondi sur la gestion des ressources humaines, présenté comme un produit: une police à empattements cursive se dévoilant discrètement sur une interface bleue moderne.