Nexo UI
React / JSX

BADGES

React Badge with Tailwind CSS

A compact React badge styled with Tailwind CSS, with separate medium and small sections plus neutral, error, warning, success, info, indigo, purple, and pink tones.

Medium Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Small Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Medium Rounded Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Small Rounded Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Medium Bordered Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Small Bordered Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Medium Rounded Bordered Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.

Small Rounded Bordered Badge

NeutralErrorWarningSuccessInfoIndigoPurplePink
Built for responsive React interfacesPreview the component, then copy the JSX.