Synthesizer-Patch mit Reglern
Eine Patch-Karte mit drei Drehreglern, die du per Ziehen oder Pfeiltasten drehst und die die Wellenform sofort neu zeichnen.
Einstellungen
Code
<article class="uvq07-syn"><header><span class="id">P07</span><h3>Glasbass</h3><span class="bpm">120 BPM</span></header><div class="sc" aria-hidden="true"><svg viewBox="0 0 100 40" preserveAspectRatio="none"><line class="ax" x1="0" x2="100" y1="20" y2="20"/><polyline class="wv" points="0.0,20.00 0.8,14.90 1.7,10.84 2.5,8.27 3.3,7.14 4.2,7.15 5.0,7.93 5.8,9.13 6.7,10.40 7.5,11.44 8.3,12.11 9.2,12.37 10.0,12.30 10.8,12.05 11.7,11.81 12.5,11.72 13.3,11.81 14.2,12.05 15.0,12.30 15.8,12.37 16.7,12.11 17.5,11.44 18.3,10.40 19.2,9.13 20.0,7.93 20.8,7.15 21.7,7.14 22.5,8.27 23.3,10.84 24.2,14.90 25.0,20.00 25.8,25.10 26.7,29.16 27.5,31.73 28.3,32.86 29.2,32.85 30.0,32.07 30.8,30.87 31.7,29.60 32.5,28.56 33.3,27.89 34.2,27.63 35.0,27.70 35.8,27.95 36.7,28.19 37.5,28.28 38.3,28.19 39.2,27.95 40.0,27.70 40.8,27.63 41.7,27.89 42.5,28.56 43.3,29.60 44.2,30.87 45.0,32.07 45.8,32.85 46.7,32.86 47.5,31.73 48.3,29.16 49.2,25.10 50.0,20.00 50.8,14.90 51.7,10.84 52.5,8.27 53.3,7.14 54.2,7.15 55.0,7.93 55.8,9.13 56.7,10.40 57.5,11.44 58.3,12.11 59.2,12.37 60.0,12.30 60.8,12.05 61.7,11.81 62.5,11.72 63.3,11.81 64.2,12.05 65.0,12.30 65.8,12.37 66.7,12.11 67.5,11.44 68.3,10.40 69.2,9.13 70.0,7.93 70.8,7.15 71.7,7.14 72.5,8.27 73.3,10.84 74.2,14.90 75.0,20.00 75.8,25.10 76.7,29.16 77.5,31.73 78.3,32.86 79.2,32.85 80.0,32.07 80.8,30.87 81.7,29.60 82.5,28.56 83.3,27.89 84.2,27.63 85.0,27.70 85.8,27.95 86.7,28.19 87.5,28.28 88.3,28.19 89.2,27.95 90.0,27.70 90.8,27.63 91.7,27.89 92.5,28.56 93.3,29.60 94.2,30.87 95.0,32.07 95.8,32.85 96.7,32.86 97.5,31.73 98.3,29.16 99.2,25.10 100.0,20.00"/></svg></div><div class="kn"><div class="kw"><div class="k" role="slider" tabindex="0" aria-label="Form" aria-valuemin="0" aria-valuemax="100" aria-valuenow="20" style="--v:20"><i></i></div><span class="lb">Form</span><b>20</b></div><div class="kw"><div class="k" role="slider" tabindex="0" aria-label="Brillanz" aria-valuemin="0" aria-valuemax="100" aria-valuenow="60" style="--v:60"><i></i></div><span class="lb">Brillanz</span><b>60</b></div><div class="kw"><div class="k" role="slider" tabindex="0" aria-label="Level" aria-valuemin="0" aria-valuemax="100" aria-valuenow="80" style="--v:80"><i></i></div><span class="lb">Level</span><b>80</b></div></div><div class="pd" role="radiogroup" aria-label="Presets"><button type="button" role="radio" aria-checked="true">A</button><button type="button" role="radio" aria-checked="false" tabindex="-1">B</button><button type="button" role="radio" aria-checked="false" tabindex="-1">C</button><button type="button" role="radio" aria-checked="false" tabindex="-1">D</button></div></article>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Karten
Alle ansehen: KartenWofür du ihn nutzen kannst
Inspiriert von kleinen Aluminium-Synthesizern verbindet diese Patch-Karte ein gebürstetes Panel, ein OLED-artiges Display und Gummipads für Presets. Die Regler sind barrierearme Slider aus einem konischen Verlauf, und sie formen die Welle live: Form schiebt den Sinus zum Rechteck, Brillanz fügt Obertöne hinzu, Pegel bestimmt die Höhe. Ideal für Musik-Tools, Audio-Plugins und kreative Portfolios.
Die Hauptfarbe lässt Welle, Reglerbögen und Preset-LEDs leuchten, die zweite Farbe ist das Panel. Eigene Presets legst du im Skript mit je drei Werten an.