Priority Select with Badge Display

A controlled select for choosing a priority level that shows the current selection as a colored badge next to the dropdown.

CnippetbyCnippet

import Particle from "@/components/ui/v-select-13";

export default function Default() {
  return (
    <div className="flex min-h-64 w-full items-center justify-center p-6">
      <Particle />
    </div>
  );
}

Source

ui.cnippet.dev

Published

8/20/2026

Similar components

Explore more

Part of Cnippet — browse the full library on 21st.dev.

Form components1522 Select components316 Badge components605 Dropdown components506

Dependencies

Tags

Newest

Popular

Shaders

Heros

Features

AI Chat Components

Calls to Action

Buttons

Testimonials

Pricing Sections

Text Components

Dependencies

Tags

Priority Select with Badge Display

Tags

Source

Published

Similar components

Explore more