IndexStyle

Un dictionnaire des styles du design, écrit à partir des œuvres elles-mêmes.

C'est du HTML nu. Il s'ouvre dans n'importe quel navigateur et sur n'importe quel appareil, sans application ni compte, et les machines lisent la même page.

Termes738

Dictionnaire

Cherchez un style ou décrivez ce que vous voulez créer. Les noms passent en premier ; l’usage, l’effet et le support ajoutent des alternatives.

EssayerBauhausun site de recrutement premiumune app financière fiable

24/202 affichées

463

Renaissance — Masaccio, La Trinité, 1425–1428 — Wikimedia Commons / Public domain

Renaissance

ルネサンス / 14th–16th century / Style / Styles historiques

Mouvement qui redécouvre la proportion antique et le corps humain et fixe les trois dimensions sur le plan par la perspective linéaire. Les mathématiques deviennent la langue commune de la peinture et de l'architecture, et c'est ici que s'établissent les normes des cinq siècles suivants, la symétrie, les ordres classiques et le nombre d'or.

Perspective linéaire à un point de fuite / Ordres classiques et symétrie / Composition fondée sur la proportion du corps / Composition triangulaire nette

design.mdprompt d’image

464

Neoclassicism — Jacques-Louis David, Le Serment des Horaces, 1784 — Wikimedia Commons / Public domain

Neoclassicism

新古典主義 / 1760s–1830s / Style / Styles historiques

Mouvement qui, en réaction à l'excès décoratif du rococo et sous l'effet des fouilles de Pompéi, revient à la simplicité antique. Le contour est dur, la couleur retenue, le sujet prêche la vertu civique. Les États de la période révolutionnaire ont choisi ce style pour visage.

Contour dur et net / Nombre de couleurs restreint / Sujets et costumes antiques / Espace peu profond, comme une scène

design.mdprompt d’image

466

Gothic Revival — Edmund F. Arras, chambre des Lords, Parlement britannique, 1913 — Wikimedia Commons / Public domain

Gothic Revival

ゴシック・リヴァイヴァル / 1740s–1900s / Style / Styles historiques

Mouvement qui choisit délibérément à nouveau l'arc brisé et la verticalité du Moyen Âge, contre l'industrialisation et contre le classicisme. Ce n'est pas une simple nostalgie. Il forge l'idée que choisir un style revient à soutenir une thèse sur la morale et le caractère national.

Arc brisé et accent sur la verticale / Voûtes sur croisée d'ogives et pinacles / Pierre associée au fer / Ornement tiré des manuscrits médiévaux

design.mdprompt d’image

472

Material Design — Google, composants d'interface Material Design — Wikimedia Commons / Public domain

Material Design

マテリアルデザイン / 2014– / Style / Google UI

Système de conception qui ramène la métaphore physique du papier et de l'encre à des règles d'ombre et de superposition. Les éléments reçoivent une hauteur, l'ombre dit la hiérarchie, le mouvement porte une causalité physique. Il est devenu le modèle d'une conception d'interface distribuée comme système.

Hiérarchie et ombre exprimées par la hauteur / Surfaces superposées comme des feuilles de papier / Mouvement montrant la cause et l'effet / Unité d'espacement normalisée

design.mdprompt d’image

479

Platinum — Bureau de Mac OS 8.1 et « À propos de ce Mac » — Wikimedia Commons / CC0

Platinum

プラチナ / 1997–2001 / Style / Apple UI

C'est le nom qu'Apple a donné à l'apparence par défaut de Mac OS 8, livrée avec l'Appearance Manager, le cadre logiciel qui permettait de remplacer plus tard toute l'apparence. Tout est construit en gris désaturés, ce qui peut être pressé reçoit un biseau et se soulève, ce qui ne peut pas s'aplatit et se fond dans le fond. Le cadre de fenêtre devenu épais annonçait que la fenêtre se déplaçait désormais en la saisissant par n'importe quel bord.

Des fenêtres et des contrôles bâtis uniquement avec des gris désaturés / Les contrôles actifs portent un biseau et se soulèvent, les contrôles désactivés s'aplatissent et se fondent dans le gris du fond / Des cadres de fenêtre épais et moulurés cohabitent avec des boîtes de dialogue modales presque sans cadre / Une case de repli à l'extrémité droite de la barre de titre, et des menus surgissants relevés en boutons portant un double triangle

design.mdprompt d’image

480

Apple Desktop Interface — Écran de Macintosh System 3, 1986 — Wikimedia Commons / CC0

Apple Desktop Interface

アップル・デスクトップ・インターフェース / 1984–1997 / Style / Apple UI

Le langage d'écran de la première génération de Macintosh, qu'Apple a elle-même nommé The Apple Desktop Interface dans son livre de directives paru en 1987. Sous la contrainte d'un seul bit de noir et de blanc, il met par écrit un répertoire de formes, les demi-teintes en trame de points, les fenêtres à coins arrondis, la barre de titre faite de filets horizontaux superposés et une police bitmap grasse.

Deux valeurs seulement, le blanc et le noir, le gris étant simulé par des points noirs en damier / Les quatre coins de la fenêtre sont arrondis et plusieurs filets horizontaux fins parcourent la barre de titre / Une barre de menus fixée au bord supérieur de l'écran, la pomme d'Apple installée à son extrémité gauche / Chicago, une police bitmap grasse dont les lettres sont comprimées dans une cellule de 9×7 points

design.mdprompt d’image

482

Windows 95 Interface — Windows 95 en polonais, bureau et menu Démarrer — Wikimedia Commons / CC0

Windows 95 Interface

Windows 95 インターフェース / 1995–2001 / Style / Microsoft UI

Le langage d'écran que Microsoft a consigné dans son livre officiel de directives de 1995. Les surfaces grises sont creusées par un liseré extérieur et un liseré intérieur, si bien que la seule direction de l'ombre indique ce qui se presse. Une barre reste postée au bord inférieur de l'écran et tous les logiciels s'assemblent avec les mêmes pièces.

Des surfaces grises encadrées d'un double liseré, une ligne claire et une ligne sombre, à l'extérieur et à l'intérieur / Une barre postée au bord inférieur de l'écran, avec un bouton carré à son extrémité gauche / Une barre de titre en bleu marine uni, avec trois petits carrés groupés à son extrémité droite / Un petit texte bitmap sans lissage, une seule lettre soulignée signalant le raccourci clavier

design.mdprompt d’image

484

Motif — Écran par défaut du Motif Window Manager (mwm), 2014 — Wikimedia Commons / CC0

Motif

モチーフ / 1989– / Style / Langages d'écran

Motif est le langage d'interface des stations de travail UNIX, maintenu par The Open Group, normalisé sous le nom d'IEEE 1295 et porté sur plus de deux cents machines. Sa documentation officielle parle elle-même d'une apparence biseautée en trois dimensions, autrement dit chaque pièce repose sur une face grise dont les bords reçoivent une couleur claire et une couleur sombre qui la font saillir.

Une face grise éclairée sur ses bords supérieur et gauche, assombrie sur ses bords inférieur et droit, si bien que chaque pièce paraît soulevée / Tant que le contrôle est maintenu enfoncé, les deux couleurs de bord s'échangent et la pièce semble s'enfoncer / Un fin cadre rectangulaire entoure le contrôle qui reçoit à cet instant les frappes du clavier / Les barres de défilement sont des rectangles à angles vifs, avec un bouton fléché triangulaire à chaque extrémité

design.mdprompt d’image

485

OPEN LOOK — Fenêtres et menu de fenêtre de style OPEN LOOK (olvwm), 2016 — Wikimedia Commons / CC BY-SA 4.0 · © Amacbride

OPEN LOOK

オープンルック / 1988–1990s / Style / Langages d'écran

Le langage d'écran pour stations de travail UNIX que Sun Microsystems a publié sous forme de spécification. Il définit en parallèle une version pour affichage en noir et blanc et une version en trois dimensions, compose tous les éléments communs dans une seule linéale et pose que la couleur doit rester discrète. La fenêtre surgissante porte une punaise à son épaule gauche, et la planter laisse la fenêtre sur le plan de travail.

Une punaise à l'extrémité gauche de l'en-tête d'une fenêtre surgissante, qui une fois plantée fixe la fenêtre au plan de travail au lieu de la refermer / Trois points à la suite d'un libellé annoncent une fenêtre, un triangle en simple contour annonce un menu / La barre de défilement se divise en un ascenseur, un câble et deux ancrages de câble en haut et en bas, la partie sombre du câble indiquant la proportion visible / Le plan de travail est fait d'une trame à 50 pour cent et l'ombre des menus d'une trame à 75 pour cent

design.mdprompt d’image

489

Adwaita — Nathan Hadley, Paramètres de GNOME 48, 2025 — Wikimedia Commons / CC BY-SA 4.0 · © Nathan Hadley (Pigeon)

Adwaita

アドワイタ / 2011– / Style / Langages d'écran

Adwaita est le nom que GNOME donne à son apparence par défaut, et ses directives posent qu'un même jeu de composants doit tenir en version claire, en version sombre et en version à contraste élevé. Une barre d'en-tête traverse le bord supérieur de la fenêtre, et les boutons qui s'y posent n'ont ni fond ni bordure. Les icônes sont unifiées en symboles monochromes de 16x16px.

Une seule barre d'en-tête traversant le bord supérieur de la fenêtre, organisée sur trois points d'alignement, le titre de la fenêtre occupant le centre / Les boutons de la barre d'en-tête n'ont ni fond ni bordure, seuls le symbole et le mot flottent sur la surface / Des icônes symboliques monochromes dessinées en 16x16px, aux traits principaux de 2px et aux formes vues de face, sans perspective / Une palette publiée offrant cinq paliers par teinte, dont le Blue 3 en #3584e4

design.mdprompt d’image

490

Metal (Java Look and Feel) — DavidL, apparence Metal de Swing, 2020 — Wikimedia Commons / CC BY-SA 4.0

Metal (Java Look and Feel)

メタル（Java ルック＆フィール） / 1998– / Style / Langages d'écran

L'apparence par défaut que Sun a conçue pour Swing, faite pour qu'un programme s'affiche de la même façon sur tous les systèmes d'exploitation. Metal était le nom de projet interne chez Sun et il est resté comme nom public. Ses marques sont les aplats bleu violet, les bordures droites d'un pixel et le refus total d'imiter la plateforme hôte.

Des barres de titre de fenêtres internes posées comme un bandeau bleu violet foncé sur un fond bleu violet pâle / Une texture fine de points et de hachures obliques imprimée dans les barres de titre et les séparateurs / Des boutons rectangulaires sans arrondi, cernés d'un filet d'un pixel bleu violet foncé / Le système hôte dessine le cadre extérieur de la fenêtre alors que tout ce qui se trouve à l'intérieur suit un autre langage visuel

design.mdprompt d’image

491

One UI — Armen777444, écran Maintenance de l'appareil de One UI 7, 2025 — Wikimedia Commons / CC BY 4.0

One UI

ワンUI / 2018– / Style / Langages d'écran

Le langage de conception que Samsung a fixé pour les Galaxy. Il coupe l'écran à la hauteur que le pouce atteint le plus facilement et appelle la partie haute zone de lecture et la partie basse zone d'interaction, si bien que les titres restent en haut tandis que les boutons, les onglets et les boîtes de dialogue se rassemblent en bas. Le contenu est réuni dans des blocs aux angles très arrondis, le fond est blanc ou noir absolu et un seul bleu porte tous les accents.

Le haut de l'écran ne contient qu'un titre et du vide, sans aucune commande tactile / Textes et images sont réunis dans des blocs en forme de cartes aux angles fortement arrondis / La barre de titre n'a que deux états, déployé et replié, et ne s'arrête jamais à une hauteur intermédiaire / En thème sombre le fond devient noir absolu et seul l'accent bleu s'y pose

design.mdprompt d’image

494

GOV.UK Design System — GDS Transport composé sur la page d'accueil de GOV.UK, 2025 — Wikimedia Commons / Public domain

GOV.UK Design System

GOV.UK デザインシステム / 2012– / Style / Langages d'écran

Le langage de conception que le Government Digital Service du gouvernement britannique publie et maintient pour les services publics. Tout tient dans une seule colonne alignée à gauche et sans ornement, composée en GDS Transport, et le bouton vert garde ses angles droits en tirant son épaisseur d'un bandeau de vert plus sombre sur son bord inférieur, s'enfonçant exactement de cette épaisseur quand on le presse. Ce qui porte le focus clavier passe au jaune avec un filet noir dessous.

Une seule colonne alignée à gauche, sans ornement, presque sans cadres et sans ombres / Un bouton vert aux angles droits avec un bandeau de vert plus sombre en bord inférieur, qui s'enfonce exactement de cette épaisseur quand on le presse / Ce qui porte le focus clavier passe au jaune, avec un filet noir tracé dessous / Les corps sautent de 48 à 36, 24, 19 puis 16px, sans rien entre eux

design.mdprompt d’image

495

Scrollytelling — interprétation générée par IA
Interprétation par IA, pas une référence

Scrollytelling

スクロールテリング / 2012– / Mise en page / Lecture sur le web

Une forme de page web où la position de lecture donne le tempo du récit. Les graphiques, les cartes et la vidéo se relaient au fil du défilement et reviennent dans le même ordre si le lecteur remonte. La recherche la range du côté de la version web du grand reportage, et son fil est soit rectiligne, soit élastique, seuls ceux qui le veulent plongeant plus profond.

Un graphique qui reste immobile à l'écran tandis qu'une seule colonne étroite de texte passe dessus / Les changements se font par l'opacité et par le déplacement de la carte, si bien que remonter les défait dans le même ordre / Photographie, vidéo et graphiques de données réunis dans un même article / Un parcours soit rectiligne, soit ouvert sur un détour facultatif plus profond dont on revient

design.mdprompt d’image

498

Explorable Explanations — Vi Hart et Nicky Case, Parable of the Polygons, 2014 — Wikimedia Commons / CC0

Explorable Explanations

エクスプローラブル・エクスプラネーション / 2011– / Technique / Lecture sur le web

Le nom que Bret Victor a donné, dans un article de mars 2011 portant ce titre, à une écriture qui enchâsse un modèle en marche dans la prose. Les nombres du texte courant portent un soulignement pointillé et, quand on les saisit pour les faire varier, la suite de la phrase et la figure d'à côté se réécrivent en même temps. Le lecteur peut ainsi secouer lui-même ce sur quoi l'argument repose.

Les nombres à l'intérieur du texte reposent sur un soulignement pointillé et passent au bleu quand on les touche / Faire glisser l'un de ces nombres réécrit d'un coup la phrase qui suit et la figure voisine / Les figures ne sont pas isolées dans un bac à sable séparé, elles se tiennent dans la continuité des paragraphes / Sans rien toucher, le texte se lit tout de même, car les valeurs par défaut donnent déjà du sens aux figures

design.mdprompt d’image

515

Talavera Poblana — Jarre de Talavera, XVIIIe siècle, musée Franz Mayer — Wikimedia Commons / CC BY-SA 3.0 · © AlejandroLinaresGarcia

Talavera Poblana

タラベラ・ポブラーナ / 16th century– / Style / Styles céramiques

La faïence née de la refonte, à Puebla, de la céramique espagnole à glaçure stannifère, peinte sur une épaisse couche de glaçure blanc laiteux. Elle emprunte les compositions en un seul bleu de la porcelaine chinoise venue par le Pacifique et y mêle des images locales comme l'aigle à deux têtes et le quetzal, ce qui la sépare de la majolique dont elle est issue.

Une épaisse glaçure blanc laiteux couvre toute la pièce et forme un ressaut là où elle s'accumule, au bord et près du pied / Un décor à compartiments peint dans un seul bleu divise le bord en petites sections et en fait le tour / Entre des fleurs et des rochers à la chinoise se glisse une seule image locale, un aigle à deux têtes ou un quetzal / Les carreaux répètent un même dessin pour couvrir tout un mur, et aucun ne porte la même pression de pinceau

design.mdprompt d’image

523

Biedermeier — Canapé Biedermeier, Autriche, vers 1815–1825, musée des beaux-arts de Montréal — Wikimedia Commons / Public domain

Biedermeier

ビーダーマイヤー / 1820s–1850s / Style / Mobilier et intérieurs

Sobriquet satirique appliqué après coup à l'art et aux intérieurs de l'Europe centrale des années 1820 aux années 1850, et devenu le nom même du style. On l'associe au goût de la classe moyenne, à des formes franches qui évitent l'ornement compliqué et à des sujets qui peignent avec sentiment les proches et la nature.

Des meubles dont le contour reste simple, sans sculpture ni marqueterie posées dessus. / À la place de l'ornement, c'est le fil du bois lui même qui vient au premier plan. / Les sujets sont des proches et la nature, traités avec sentiment. / Des dimensions modestes, faites pour la pièce d'un bourgeois et non pour une salle princière.

design.mdprompt d’image

525

Empire Style — Atelier Jacob, fauteuil de Joséphine aux accotoirs en col de cygne, vers 1804, château de Malmaison — Wikimedia Commons / CC0

Empire Style

アンピール様式 / 1804–1814 / Style / Mobilier et intérieurs

Style d'intérieur et de mobilier répandu depuis la France sous l'Empire napoléonien, où de grandes surfaces unies reçoivent des bronzes dorés posés comme des points. Pattes de lion, têtes de sphinge ailée, lotus et rosaces circulaires se rangent par paires, et cette disposition symétrique le fait paraître plus lourd que le néoclassicisme qui le précède.

Sur des plans d'acajou unis, les bronzes dorés sont posés en points régulièrement espacés. / Le pied avant se termine en patte de lion en bas et en tête de sphinge ailée en haut, laquelle porte l'accotoir. / Une file de rosaces circulaires court à intervalles égaux sur la traverse basse du dossier. / Les sièges vont par paires identiques, et l'assise comme le mur reçoivent la même soie sombre.

design.mdprompt d’image

527

Craftsman Style — Gustav Stickley (United Crafts), fauteuil, 1901, Art Institute of Chicago — Wikimedia Commons / CC BY 3.0 · © Sailko

Craftsman Style

クラフツマン様式 / 1870s–1920s / Style / Mobilier et intérieurs

Style d'architecture, d'aménagement intérieur et d'arts décoratifs répandu aux États-Unis depuis environ 1870 jusque vers 1925. Il prolonge l'Arts and Crafts anglais en renonçant à citer les styles historiques pour choisir la simplicité, mais ses porteurs allèrent jusqu'aux réformateurs sociaux, aux éducateurs et aux associations féminines. Il se manifeste surtout dans de petites maisons comme le bungalow, où le matériau se montre tel quel.

Les pièces de structure, poutres et corbeaux, restent apparentes au lieu d'être coffrées. / Aucun chapiteau, aucune volute, aucune pièce empruntée aux styles historiques. / Cela tient à l'échelle d'une maison modeste comme le bungalow et non d'une demeure. / Le bois et la pierre ne sont pas peints, si bien que les surfaces se font de fil et de couleur naturelle.

design.mdprompt d’image

532

Xerox Star Interface — Bureau et icônes du Xerox 8010 Star (ViewPoint) — Wikimedia Commons / CC BY 2.0 · © J R

Xerox Star Interface

ゼロックス・スター・インターフェース / 1981–1990s / Style / Langages d'écran

Le langage d'écran fixé par le Xerox 8010 de 1981. Dossiers, corbeilles d'arrivée et de départ, tiroirs de classement et autres fournitures de bureau apparaissent en figures munies d'un libellé, et la brochure de l'époque appelait cela un bureau électronique. Les objets à l'écran se déplacent, se copient et se jettent librement à la souris.

Chaque figure à l'écran porte un libellé, si bien que le sens ne repose jamais sur la seule image / Les figures représentent des objets d'un bureau, dossiers, corbeilles d'arrivée et de départ, tiroirs de classement / On saisit les objets avec la souris, et déplacer, copier et supprimer forment une même famille de gestes / Le tableur se présente en grille de lignes et de colonnes, les commandes qui agissent dessus étant réunies dans des menus

design.mdprompt d’image

534

Breeze — Breeze sous KDE Plasma 6 (Debian Trixie) — Wikimedia Commons / CC0

Breeze

ブリーズ / 2014– / Style / Langages d'écran

Le style visuel par défaut que KDE a introduit avec Plasma 5. L'annonce le décrit elle-même comme un thème plat et très contrasté, et les figures y sont simplifiées et rapprochées du monochrome. Au lieu d'ornement, la composition typographique sert à distinguer les éléments, et une version claire et une version sombre sont livrées en paire dès le départ.

Des surfaces planes sans modelé, où la limite entre éléments tient au seul écart de couleur et de contraste / Icônes et figures ramenées vers le monochrome, avec un nombre de couleurs restreint / Le contraste entre titre et texte remplace l'ornement, et la composition typographique porte l'écran / Les mêmes figures existent en version claire et en version sombre, appariées

design.mdprompt d’image

537

Ribbon — Ruban de style Office 2007 et onglets contextuels — Wikimedia Commons / CC BY-SA 4.0 · © Halil Şimşek P

Ribbon

リボン / 2007– / Mise en page / Microsoft UI

C'est un bandeau de commandes qui les range en une série d'onglets en haut de la fenêtre et remplace à la fois la barre de menus et les barres d'outils. Introduit avec Office 2007, il a reçu de Microsoft un vocabulaire officiel, onglets, groupes, onglets contextuels et galeries. Chaque commande porte un libellé et sa taille dépend de la fréquence d'usage.

Un bandeau à onglets occupe en permanence le haut de la fenêtre, sur une hauteur fixée à 48 pixels / Le bandeau est découpé en groupes nommés, le nom de chaque groupe courant le long de son bord inférieur / Les icônes de commande existent en deux tailles, 32 par 32 et 16 par 16, et seules les commandes fréquentes prennent la grande et ouvrent le groupe / Des onglets contextuels colorés apparaissent selon le type d'objet sélectionné, et le nom de cet ensemble d'onglets se termine par Tools

design.mdprompt d’image

538

Solarized — Xcode 4 avec Solarized Light appliqué, 2011 — Wikimedia Commons / CC BY 2.0 · © Jason Brennan from Ottawa, Canada

Solarized

ソラライズド / 2011– / Style / Styles d'interface

Seize couleurs pour terminal et éditeur qu'Ethan Schoonover a publiées avec toutes leurs valeurs. Elles se composent de huit tons de fond et de huit accents, et les écarts de clarté CIELAB entre les tons de fond sont symétriques, si bien que passer du fond clair au fond sombre ne change pas le régime de lecture. L'écart de luminosité est abaissé et ce sont les écarts de teinte qui distinguent les mots.

Les fonds ne sont ni noir pur ni blanc pur, l'un tire vers le bleu vert, l'autre vers la crème / L'écart de clarté entre le texte et le fond reste faible, plus doux que du noir sur blanc / Les huit accents ont une clarté presque égale et ne se distinguent que par la teinte / En passant du fond sombre au fond clair, le même accent revient avec le même rôle

design.mdprompt d’image

539

Skeleton Screen — interprétation générée par IA
Interprétation par IA, pas une référence

Skeleton Screen

スケルトン・スクリーン / 2013– / Technique / Styles d'interface

Un traitement du chargement qui renonce à l'indicateur rotatif et montre d'abord l'écran vide, puis y verse l'information peu à peu. Luke Wroblewski l'a présenté sous ce nom en 2013, en tirant les leçons de sa propre application Polar. Il montre que quelque chose avance, plutôt que le fait de faire attendre.

Pendant le chargement, ni indicateur rotatif ni barre de progression / Là où viendront textes et images se trouvent déjà des plages unies à la dimension qu'ils occuperont / La mise en page est arrêtée avant l'arrivée des données, et rien ne bouge quand elles arrivent / L'information ne surgit pas d'un coup, chaque zone se remplit à son tour

design.mdprompt d’image

Ligne éditoriale

IndexStyle ne rassemble pas tous les termes du design. Une entrée autonome doit décrire un langage visuel reconnaissable, reproductible et distinct de ses voisins. Critères éditoriaux

Revenir en haut