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

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

Label variant to show. Sets the copy and icon; all variants share one color.

---

isIconHidden

boolean = false

Hide the icon, show only the label.

---

theme

"light" | "dark" = "light"

Visual theme for the fill and text.

---