An 8-bit RPG-style dialogue box pairing a pixel-framed avatar with a retro alert speech bubble, supporting left-aligned player and right-aligned NPC layouts via the player prop.
"use client"; import Dialogue from "@/components/ui/8bit-dialogue"; export default function Default() { return ( <div className="flex w-full min-h-screen items-center justify-center bg-background p-8 retro"> <div className="py-4 flex flex-col gap-4 w-full max-w-[500px]"> <Dialogue avatarSrc="/images/pixelized-8bitcnorc.jpg" avatarFallback="Orc" title="Orc" description="I bring you a gift… it's called AXE TO THE FACE! SLASH!!" /> <div className="flex justify-end"> <Dialogue avatarSrc="/images/goblin.png" avatarFallback="Goblin" title="Goblin" description="`Screeches like a dying flute`" player={false} /> </div> </div> </div> ); }
Part of 8bitcn — browse the full library on 21st.dev.