A checkbox that fills with its accent, pops its tick and strikes its label through.
About this tool
A square outline that floods with the accent the moment it is checked, while the tick springs past its resting size before settling and a ring expands out of the box and fades. The label dims and a rule is drawn across it left to right, so a completed task reads as done from across the room. Duration, overshoot and ripple are sliders and the strike can be switched off, so the same component covers a playful to-do list and a restrained settings row. Every length is a ratio of the box, so it holds from a dense list up to a hero.
UI/UX · HTML / CSS · All tools