La fonction CSS shape() du module Shapes Level 2 permet de créer des tracés complexes et fluides directement dans les feuilles de style, offrant une alternative aux méthodes rigides comme polygon() ou path(). Contrairement à ces dernières, elle combine la syntaxe vectorielle SVG avec des unités CSS flexibles (pourcentages, em, etc.), garantissant des formes responsives sans dépendre d’images externes ou de calculs lourds.
L’article explique son fonctionnement via des commandes de dessin intuitives (from, move to, line to, curve, etc.), similaires à celles des tracés SVG, mais adaptées aux besoins du CSS moderne. Elle s’applique notamment aux propriétés clip-path (pour découper des éléments) et offset-path (pour animer des objets le long d’un tracé).
Enfin, le guide illustre son utilité avec des cas concrets comme une bulle de dialogue responsive ou une bannière à bordure incurvée, tout en soulignant ses avantages en termes de performances et de référencement naturel. Bien que supportée par la plupart des navigateurs récents, cette fonction reste à explorer pour des designs plus dynamiques et maintenables.