dxDigitexa UI
HomeDocsComponentsExamplesAI
Get started
Sections
IntroductionComponentsInstallationThemingCLIFor AI agentsChangelog
Examples
Workspace overviewSettings
Components
AccordionActivity feedAlertAlert dialogAvatarBadgeBreadcrumbButtonCalendarCalendar viewCardCheckboxCollapsibleComboboxCommandContext menuData tableDate pickerDialogDropdown menuEmpty stateFieldHover cardInputInput groupKanbanKbdLabelMeterPaginationPopoverPriorityProgressRadio groupScroll areaSelectSeparatorSheetSidebarSkeletonSliderSpinnerStatus iconSwitchTableTabsTask rowTextareaTimelineToastToggleToggle groupTooltip

Badge

Semantic and work status variants, StatusBadge.

StatusBacklogTo doIn progressIn reviewDone
SemanticNeutralOutlineAccentSuccessWarningAt riskInfo

Installation

$ curl -fsSL https://ui.digitexa.com/dx.mjs | node --input-type=module - add badge

Also adds utils, theme and installs class-variance-authority.

Usage

import { Badge, StatusBadge, badgeVariants, statusLabels } from "@/components/ui/badge";

The Code tab above shows a complete example.

AvatarBreadcrumb
On this page
PreviewInstallationUsage