Wave CTA
A button that fills with liquid on hover. The surface tilts toward the cursor, sloshes when you leave, and a click sends a ripple.
- 4 KB .bexode
- 7 live inputs
- Responsive fit Layout
Use it
The code follows your customizations. Install with npm i exodeui.
import { ExodeUICanvas } from 'exodeui';
// wave-cta.bexode goes in /public (download it below)
export function WaveCta() {
return (
<ExodeUICanvas
src="/wave-cta.bexode"
fit="Layout" // responsive: redraws at any container size
autoPlay
interactive
onTrigger={(name) => {
// fires: 'click'
}}
style={{ width: '100%', height: 360 }}
/>
);
}Inputs
| Input | Type | Default | Range |
|---|---|---|---|
label | Text | Start building | — |
wave | Number | 1 | 0 – 3 |
speed | Number | 1 | 0.1 – 3 |
radius | Number | 1 | 0 – 1 |
accent | Text | #c8ff5a | hex colour |
text | Text | #f2f5ea | hex colour |
bg | Text | #0a0c08 | hex colour |
Events (via onTrigger): click