About this component

The card is strung with invisible, taut strings that catch the digital wind. Content appears as vibrations along these strings. Hover changes the wind's direction and strength, altering the harmonic drone and making the text tremble. Clicking plucks a string, isolating its associated piece of information. The card's soundscape is entirely generated by interaction, a unique hum for every visitor.

Difficulty

Expert

Style

Aeolian/Acoustic

Frameworks

HTML/CSS, Tailwind, React, Vue, Angular, Svelte, LWC

Embed this component

Paste this snippet into any site — the design renders in a sandboxed iframe served from /embed/aeolian-harp-card.