Search
Copy Code
Previous: Avatar
Next: Marker
Close Terminal
Light Mode
ProTeamsGuestEnterpriseTrial
badge-demo.tsx
prompt.md
Collapse
Reset
Copy Code
Download
Run
1
"use client";
2
3
export function BadgeDemo() {
4
return (
5
<div className="flex flex-wrap items-center justify-center gap-3 p-4 bg-transparent">
6
<span className="px-3.5 py-1 rounded-full text-[12px] font-matter font-medium bg-[#C3E88D] text-black shadow-sm">Pro</span>
7
<span className="px-3.5 py-1 rounded-full text-[12px] font-matter font-medium bg-[#BAE6FD] text-black shadow-sm">Teams</span>
8
<span className="px-3.5 py-1 rounded-full text-[12px] font-matter font-medium bg-[#FED7AA] text-black shadow-sm">Guest</span>
9
<span className="px-3.5 py-1 rounded-full text-[12px] font-matter font-medium bg-[#E9D5FF] text-black shadow-sm">Enterprise</span>
10
<span className="px-3.5 py-1 rounded-full text-[12px] font-matter font-medium bg-[#FBCFE8] text-black shadow-sm">Trial</span>
11
</div>
12
);
13
}
14