An expressive rabbit boy mascot with round glasses and mood-driven face animations.
Current mood: Neutral
pnpm dlx shadcn@latest add @gammaui/rabbit-mascot
"use client"
import { useState } from "react"
import { RabbitMascot, type RabbitMood } from "@/components/rabbit-mascot"
export default function Example() {
const [mood, setMood] = useState<RabbitMood>("neutral")
return (
<RabbitMascot
mood={mood}
size={280}
onClick={() => setMood("happy")}
/>
)
}| Mood | Description |
|---|---|
neutral | Default smile with round glasses |
happy | Arc eyes, open mouth, sparkles |
sad | Furrowed brows and tears |
love | Star eyes and heart twinkles |
winky | One-eye wink |
surprised | Small O mouth |
thinking | Half-closed lids |
side-eye | Side glance |
shy | Peeking / password face |
| Prop | Type | Default | Description |
|---|---|---|---|
mood | RabbitMood | "neutral" | Current facial expression |
size | number | 280 | Width in pixels |
className | string | — | Extra CSS classes |
onClick | () => void | — | Optional click handler |