Brand Badge

Usage

BetaProPro TeamTeamProEnt

import { BrandBadge } from "stylus-ui/BrandBadge";

export default () => (
  <div className="flex gap-2">
    <BrandBadge type="beta" />
    <BrandBadge type="pro" />
    <BrandBadge type="proTeam" />
    <BrandBadge type="team" />
    <BrandBadge type="proTrial" />
    <BrandBadge type="enterprise" />
  </div>
);

API Reference

BrandBadge

A small, stylish tag that can be used to mark premium or professional content or users.

type

Required

"beta" | "enterprise" | "pro" | "proTrial" | "proTeam" | "team"

Badge variant: beta, pro, proTrial, proTeam, team, or enterprise (each has distinct gradient and icon).

---

isIconHidden

boolean = false

Hide the icon, show only the label.

---

theme

"light" | "dark" = "light"

Visual theme for gradient and text.

---