KQ-1218 · DANDELION/AIR
Dandelion Air
An air-quality widget drawn as a dandelion clock: the seeds still on the head are the reading, a full clock in clean air and a bald stalk in hazardous air, and when the index rises the seeds that no longer belong let go in a cascade and sail off downwind, turning pappus-up as they go, while the sky takes a haze in the band's colour and the marker glides along the band scale on the glide spring. A quick swipe across the head blows the seeds it passes along the swipe and the stem takes the gust and springs back on the recoil spring, then the head fills back in to the reading. The head is a real button: a tap, Space or Enter is one gust downwind.
Moderate
Fine for most people.
Swipe across it, or press Enter, to blow the seeds. The seeds left show the air: fewer seeds, worse air.
aqi 72 · moderate · 14:00
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/dandelion-air
Props
- aqi
- number
- default —
- The air quality index, 0 to 500: how many seeds stay on the head, the haze, the band and the number.
- wind
- number
- default 0.4
- How hard the wind blows, 0 to 1: the lean of the stem and how fast seeds sail off.
- seeds
- number
- default 48
- How many seeds a full head carries, 24 to 72.
- label
- string
- default "Air quality"
- The widget's name, used for the reading and the band announcements.
- place
- string
- default —
- Where the reading is from, shown over the sky.
- onBlow
- (left: number) => void
- default —
- After a blow, with how many seeds are left on the head before it fills back in.
- sound
- boolean
- default false
- A swish for each blow, pitched by the swipe's speed. The index changing is silent.
- disabled
- boolean
- default false
- Keeps showing the reading, but takes no swipe, tap or keys.
- className
- string
- default —
- Classes for the tile.
| Prop | Type | Default | Description |
|---|---|---|---|
| aqi | number | — | The air quality index, 0 to 500: how many seeds stay on the head, the haze, the band and the number. |
| wind | number | 0.4 | How hard the wind blows, 0 to 1: the lean of the stem and how fast seeds sail off. |
| seeds | number | 48 | How many seeds a full head carries, 24 to 72. |
| label | string | "Air quality" | The widget's name, used for the reading and the band announcements. |
| place | string | — | Where the reading is from, shown over the sky. |
| onBlow | (left: number) => void | — | After a blow, with how many seeds are left on the head before it fills back in. |
| sound | boolean | false | A swish for each blow, pitched by the swipe's speed. The index changing is silent. |
| disabled | boolean | false | Keeps showing the reading, but takes no swipe, tap or keys. |
| className | string | — | Classes for the tile. |