el mar guarda tu nombre

Arrastra las palabras o muévelas con las flechas

HTML + CSSText & Scroll

Magnetpoesie am Kühlschrank

Eine emaillierte Kühlschranktür mit Wortmagneten, die man mit dem Finger zieht oder mit den Pfeiltasten verschiebt, um Verse zu legen.

Einstellungen

16px
1x

Code

<div class="uvq14-mag"><div class="dr" role="group" aria-label="Wortmagnete" aria-describedby="uvq14-mag-h"><p class="sr">das Meer bewahrt deinen Namen</p><p class="ex" hidden>langsam und heute in blauem Salz</p><div class="ws" translate="no"></div><i class="hd" aria-hidden="true"></i></div><p class="hn" id="uvq14-mag-h">Zieh die Wörter oder bewege sie mit den Pfeiltasten</p></div>

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.

Markdown-Version mit dem ganzen Code, für KI-Assistenten

Mehr aus Text & Scroll

Alle ansehen: Text & Scroll

Wofür du ihn nutzen kannst

Magnetpoesie hat Küchentüren in Notizbücher verwandelt, und dieser Block holt das Spiel ins Web. Jedes Wort ist ein kleines, schräges Plättchen auf einer glänzenden Kühlschranktür mit Chromgriff; beim Ziehen hebt es sich mit Schatten und bleibt liegen, wo es landet. Er passt zu Schreibwerkstätten, Literaturfestivals, Markenaktionen zum Mitspielen und kreativem Onboarding.

Schreib deinen Satz ins Textfeld und die Zusatzwörter in die versteckte Liste; daraus werden automatisch Plättchen. Die Hauptfarbe färbt die Tür, die Zweitfarbe die Akzentplättchen. Jedes Plättchen ist ein Button, die Pfeiltasten verschieben es, mit Shift geht es schneller.