A design system built to feel finished

import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardTitle } from "@/components/ui/card"

export function UpgradeCard() {
  return (
    <Card variant="elevated">
      <CardContent className="grid justify-items-start gap-3">
        <Badge variant="purple" dot pill>Pro</Badge>
        <CardTitle>Unlock every theme</CardTitle>
        <CardDescription>Cream, Moonlight and all 8 accents.</CardDescription>
        <Button>Upgrade plan</Button>
      </CardContent>
    </Card>
  )
}