Skip to the content
Surface
Docs
Tutorial
Playground
Changelog
Search
Ctrl K
Playground
App.surf
The code stays in the address, so a link shares it.
Tutorial
Reset
Copy link
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
state count = 0; motion phase(ms: 1400, ease: "ease-spring") = count.toFloat() * 3.0; fn bar(i: Int) -> Float = 56.0 + 44.0 * (i.toFloat() * 0.35 + phase).sin(); --- <Column style="gap-6"> <Row decorative style="h-28 gap-1 items-end"> #for i in 0..32 key i { <Column style="grow h-{bar(i)}px rounded-full bg-$accent opacity-{bar(i) / 110.0}" /> } </Row> <Row style="gap-4 items-center"> <Button style="px-5 py-2.5 rounded-$radius bg-$accent text-$on-accent" on:press={count += 1} > Make a wave </Button> <Text style="text-$text-secondary">Waves: {count}</Text> </Row> </Column>
Preview
1 error
The sandbox needs a browser.
