Buttons

Scanline sweep button

A dark console-style button that drops a thin glowing bar down its face on hover while the heavy edge of its border migrates from bottom to top.

Using Scanline sweep button

A dark console-style button that drops a thin glowing bar down its face on hover while the heavy edge of its border migrates from bottom to top.

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: accent, label, sweepSeconds, barHeight, bloom

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

2641Border brighten buttonButtonsA dark button whose two pixel frame is the only moving part: it climbs to white on hover and collapses into a tight inner ring while the button is held.

2709Border trace buttonButtonsA quiet translucent button whose four edges draw themselves in sequence on hover while a soft band of light crosses the face.

2659Contrast Boost Frame ButtonButtonsA pale inner plate floats inside a thick painted frame, and hovering cranks the whole thing brighter and more saturated without moving anything.

1631Day night sweep toggleButtonsAn icon button that cycles a settings panel between light, dark and automatic, repainting it with a hard clipped edge that sweeps across instead of a fade.

2626Diagonal orb fill buttonButtonsOne oversized circle slides corner to corner across an outlined button, filling it on the diagonal, and darkens the instant you press.

2669Graphite Slab CTAButtonsA fixed-width dark slab button with a subtle graphite ramp that lifts on hover and carries a thin accent rule along its bottom edge.