Soda Can
A drinks can with a true cylindrical label wrap, condensation and a splash when you click to change flavour.
- 6.5 KB .bexode
- 7 live inputs
- Responsive fit Layout
Use it
The code follows your customizations. Install with npm i exodeui.
import { ExodeUICanvas } from 'exodeui';
// soda-can.bexode goes in /public (download it below)
export function SodaCan() {
return (
<ExodeUICanvas
src="/soda-can.bexode"
fit="Layout" // responsive: redraws at any container size
autoPlay
interactive
onTrigger={(name) => {
// fires: 'ctaClick'
}}
style={{ width: '100%', height: 560 }}
/>
);
}Inputs
| Input | Type | Default | Range |
|---|---|---|---|
name | Text | FIZZ Sparkling | — |
tagline | Text | Real fruit, cold-pressed and carbonated hard. Zero sugar, all bite. | — |
cta | Text | Get a 12-pack | — |
flavors | Text | Blood Orange:#ff6a2b:#c2311a:#2a0d08,Yuzu Lime:#c8ef45:#6fa818:#123008,Wild Berry:#e0457b:#8a1d4a:#26061a | — |
speed | Number | 1 | 0.1 – 3 |
bg | Text | #0d0b0a | hex colour |
text | Text | #f7f2ec | hex colour |
Events (via onTrigger): ctaClick