••
< if title: />

Day12 : Curved text along a path with svg

projet : web experiments ← du lundi 7 septembre 2020
< if content: />

Jour 12, j’ai reçu une maquette il y a quelques jours d’un projet de site dans le quel il y avait des textes incurvés. La premiere idée serait d’utilisé du javascript comme arctext.js le faisait. Pour se moderniser et jouer avec le svg et le css j’ai découvert que l’on pouvait faire suivre un texte le long d’une forme svg (n’importe quelle forme), ici on va faire ca sur un demie cercle:



Réalisons notre texte incurvé :

On crée notre path svg (forme)

On ajoute notre texte

On met une petite animation d’apparition

Le résultat : https://quentinrenaux.com/xp/1day1code/curved-text/

< if thumbnail: />