HTML + CSSBoutons

Pad de boîte à rythmes

Un pad en caoutchouc qui s'allume plus fort quand on le frappe près du centre, avec la vélocité affichée dans un coin.

Réglages

16px
1x

Code

<button class="uvq01-pad" type="button"><span class="lt" aria-hidden="true"></span><span class="t">Grosse caisse</span><span class="v" aria-hidden="true">VEL <b>000</b></span></button>

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 Boutons

Voir tout : Boutons

Où l’utiliser

Inspiré des pads de samplers et de boîtes à rythmes, ce bouton carré en caoutchouc lit l'endroit où on le frappe : au centre il brille à pleine puissance, sur le bord il reste discret, et un petit afficheur indique la vélocité de 0 à 127. La lumière s'éteint comme une LED sous du silicone translucide. Pour les applis musicales, créateurs de rythmes et boîtes à sons.

La couleur principale est la LED et la secondaire le cœur du flash : magenta et jaune ou cyan et blanc fonctionnent tous les deux. Servez-vous du libellé pour le nom du son et assemblez une grille de pads pour obtenir un kit complet.