Retro Pixel Button
A retro-styled animated button with a sliding pixel block, smooth transitions, and customizable colors.
Installation
pnpm dlx rareui add retro-pixel-button
Usage
1
Import the component
import RetroPixelButton from '@/components/rareui/retro-pixel-button';
2
Use in your application
export default function App() {
return (
<RetroPixelButton onClick={() => alert('Clicked!')}>
CLICK ME
</RetroPixelButton>
);
}
Features
Font-mono styling with pixelated arrow icon.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | React.ReactNode | "TRY..." | The button text content. |
pixelColor | string | "orange" | Color of the sliding pixel block. |
baseColor | string | - | Optional background color override. |
textColor | string | - | Optional text color override. |
className | string | - | Additional CSS classes. |