Forma de la hoja

Hojas elegidas:

HTML + CSSFiltres

Herbier par forme de feuille

Des planches d'herbier aux feuilles pressées : coche une forme et la feuille reverdit pendant que son nom est entouré au crayon.

Réglages

16px
1x

Code

<fieldset class="uvq05-hb"><legend>Forme de la feuille</legend><div class="gr"><label style="--r:-2deg"><input type="checkbox"><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="s" d="M20 49V10"/><path class="v" style="stroke-width:1.6" d="M20 14l-8-7M20 14l8-7M20 21l-10-6M20 21l10-6M20 28l-10-6M20 28l10-6M20 35l-9-6M20 35l9-6M20 42l-7-5M20 42l7-5"/></svg><span class="nm">Aciculaire<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label><label style="--r:1.5deg"><input type="checkbox" checked><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="b" d="M20 3C29 13 29 30 20 42C11 30 11 13 20 3Z"/><path class="v" d="M20 6V42M20 16l-4-3M20 16l4-3M20 24l-5-4M20 24l5-4M20 32l-4-3M20 32l4-3"/><path class="s" d="M20 42v7"/></svg><span class="nm">Lancéolée<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label><label style="--r:-1deg"><input type="checkbox"><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="b" d="M20 4C31 12 37 22 33 31c-3 6-10 6-13 1-3 5-10 5-13-1C3 22 9 12 20 4Z"/><path class="v" d="M20 7V32M20 16l-6-4M20 16l6-4M20 24l-8-4M20 24l8-4"/><path class="s" d="M20 32v17"/></svg><span class="nm">Cordée<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label><label style="--r:2deg"><input type="checkbox"><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="b" d="M20 3c4 2 2 6 6 7s5 4 3 7 5 3 4 7-4 3-2 6-3 5-7 4-3 5-4 6c-1-1 0-5-4-6s-5-2-7-4 2-4-2-6-1-6 4-7-2-5 3-7 4-4 6-7Z"/><path class="v" d="M20 5V40M20 13l4-3M20 13l-4-3M20 21l6-3M20 21l-6-3M20 29l6-2M20 29l-6-2"/><path class="s" d="M20 40v9"/></svg><span class="nm">Lobée<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label><label style="--r:-1.5deg"><input type="checkbox" checked><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="b" d="M20 36l-11 4 2-6-9-5 7-3-4-9 8 3 1-9 6 6 0-11 0 0 4 11 3-7 4 8 6-4-2 9 7 3-8 5 2 6-11-4z"/><path class="v" d="M20 36V8M20 36L8 22M20 36l12-14M20 36L5 31M20 36l15-5"/><path class="s" d="M20 36v13"/></svg><span class="nm">Palmée<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label><label style="--r:1deg"><input type="checkbox"><span class="sh"><i class="tp" aria-hidden="true"></i><svg class="lf" viewBox="0 0 40 50" aria-hidden="true"><path class="s" d="M20 49V5"/><ellipse class="b" cx="13" cy="10" rx="5" ry="2.6" transform="rotate(-25 13 10)"/><ellipse class="b" cx="27" cy="10" rx="5" ry="2.6" transform="rotate(25 27 10)"/><ellipse class="b" cx="13" cy="18" rx="5" ry="2.6" transform="rotate(-25 13 18)"/><ellipse class="b" cx="27" cy="18" rx="5" ry="2.6" transform="rotate(25 27 18)"/><ellipse class="b" cx="13" cy="26" rx="5" ry="2.6" transform="rotate(-25 13 26)"/><ellipse class="b" cx="27" cy="26" rx="5" ry="2.6" transform="rotate(25 27 26)"/><ellipse class="b" cx="13" cy="34" rx="5" ry="2.6" transform="rotate(-25 13 34)"/><ellipse class="b" cx="27" cy="34" rx="5" ry="2.6" transform="rotate(25 27 34)"/><ellipse class="b" cx="20" cy="4" rx="2.6" ry="4.5"/></svg><span class="nm">Composée<svg class="pc" viewBox="0 0 100 30" preserveAspectRatio="none" aria-hidden="true"><path d="M8 17C9 6 52 3 88 8c12 3 10 14-4 17-30 5-70 4-78-4C2 17 8 10 22 7" pathLength="1"/></svg></span></span></label></div><p class="ct"><span>Feuilles choisies :</span> <span class="n"></span></p></fieldset>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Version Markdown avec tout le code, pour les assistants IA

Plus dans Filtres

Voir tout : Filtres

Où l’utiliser

Les pépinières, jardineries et guides nature peuvent filtrer par forme de feuille, et un herbier la montre mieux qu'un mot. Six planches de papier scotchées portent des feuilles pressées dessinées en SVG, de l'aciculaire à la composée. En cocher une redresse la planche, rend à la feuille séchée son vert frais et trace au crayon une boucle autour de son nom.

La première couleur est le vert frais et la seconde le papier. Remplace les feuilles par des fleurs, des graines ou des champignons en modifiant les tracés SVG, et garde des noms courts pour que la boucle au crayon les entoure bien.