Back

Connect Wallet Button

Component Code (Next.js)

Use Copy Code to load the current local source for the Connect Wallet button component.

Claude / Codex Prompt

Create a compact Connect Wallet button inspired by the shared screenshot:
- Realistic web/mobile sizing, not oversized: around 260-294px wide and 54-58px tall.
- Cyan glassy face with subtle scanline/pixel texture and dark text.
- Dark square action block on the right with a dotted arrow/grid mark.
- Hover state brightens the cyan face, sweeps a sheen across the surface, and moves the dot arrow slightly to the right.
- Pressed state feels tactile with a small downward compression.
- Use a real button element, visible focus ring, disabled/connecting support, and reduced-motion-safe CSS.