Sticker Badge

Displays the Kickresume Premium or Free sticker mark. This is the only design-system primitive that uses bold italic type.

PremiumFree

Loading…

import { StickerBadge } from "@/components/ui/sticker-badge"

export default function StickerBadgeDemo() {
  return (
    <div className="flex flex-wrap items-center gap-6">
      <StickerBadge>Premium</StickerBadge>
      <StickerBadge variant="free">Free</StickerBadge>
    </div>
  )
}

Installation

pnpm dlx shadcn@latest add @kickresume/sticker-badge

Usage

import { StickerBadge } from "@/components/ui/sticker-badge"

<StickerBadge>Premium</StickerBadge>
<StickerBadge variant="free">Free</StickerBadge>

API Reference

Prop	Type	Default
`variant`	`"premium" \| "free"`	`"premium"`
`size`	`"default" \| "sm"`	`"default"`
`render`	`ReactElement \| RenderFunction`	-