Aedis UI

Badge

Small status label: level, channel, state.

Junior24/7Hand raisedSlack

Installation

Once per app, set up Aedis UI. The CLI verifies the signed release before writing anything and pins every dependency:

npx @aedis/cli@0.1.0 init

Import the theme once in your global CSS, after Tailwind:

app/globals.css
@import "tailwindcss";@import "./styles/aedis-theme.css";

Then add the component:

npx @aedis/cli@0.1.0 add badge# pnpm dlx @aedis/cli@0.1.0 add badge · yarn dlx @aedis/cli@0.1.0 add badge · bunx @aedis/cli@0.1.0 add badge

Props

PropTypeDefaultDescription
variant"default" | "secondary" | "accent" | "outline" | "destructive""default"Visual style.

Security

  • Text only; pass labels as children.