Buttons

Mood swap button

A round button holding a drawn face that shifts expression on hover and press, then locks the mood in when clicked.

Hover to raise a brow, hold to squint, click to lock the mood in.

Using Mood swap button

A round button holding a drawn face that shifts expression on hover and press, then locks the mood in when clicked.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: size, accent, mood, showCaption, strokeWeight

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

2466Add Then Confirm ChipButtonsA dark chip with a warm label whose plus rocks side to side on hover, then rotates into a tick and reports the item added.

2574Arcade dome buttonButtonsA round pushbutton whose domed cap floats above a darker base and seats flush with a visible drop when pressed.

2115Bookmark save chipButtonsA compact save chip whose bookmark mark snaps from outline to filled and gives one small tug downward the moment an item is saved.

2575Bookmark save toggleButtonsA compact save chip whose bookmark glyph fills solid and keeps a hairline border once the item is saved.

2470Breathing transport toggleButtonsA tinted playback chip that swaps between play and pause on click, its glyph breathing while the pointer rests on it.

2550Captioned Like ButtonButtonsAn icon-only heart button that reveals a caption rising from beneath on hover or focus, and fills solid with a quick overshoot when liked.