cnippet – shadcn/ui Components – Page 7

Add Filters

@cnippet/v-autocomplete-5

Inline Autocomplete

block

@cnippet/v-autocomplete-6

Auto Highlight

block

@cnippet/v-autocomplete-7

With Clear Button

block

@cnippet/v-autocomplete-8

With Trigger and Clear Buttons

block

@cnippet/v-autocomplete-9

With Search Icon

Default

With Hover Effect

With Hover Effect & Tooltips

block

@cnippet/v-avatar-12

Avatar Inside An Empty State Example

block

@cnippet/v-avatar-13

With Loading State Demonstration

With Custom Badge

With Ring Animation

With Dropdown Menu

Team grid with online presence status dots

block

@cnippet/v-avatar-18

Pull request comment thread

block

@cnippet/v-avatar-19

Interactive assignee picker with selection state

With Fallback

Contributor leaderboard with rank and commit count

block

@cnippet/v-avatar-21

Profile card with stats and action buttons

Different Sizes

Different Radius

Avatar Group

Avatar Group With Numeric Count

block

@cnippet/v-avatar-7

With Details and Badge

block

@cnippet/v-avatar-8

Avatar Social Proof With Text Label

block

@cnippet/v-avatar-9

Compact Social Proof With Initials

Default

With Icon

With Link

With Count

Status dot indicators (Online, Busy, Away, Offline)

block

@cnippet/v-badge-14

Release channel tags (Stable, Beta, Experimental, Deprecated)

block

@cnippet/v-badge-15

Subscription plan tiers with pricing

block

@cnippet/v-badge-16

Notification category badges with unread counts

block

@cnippet/v-badge-17

Priority labels in a task list

Outline

Secondary

Destructive

Info

Success

Warning

Error

Size Variations

@cnippet/v-breadcrumb-1

Default

block

@cnippet/v-breadcrumb-10

With Project, Sser and Document Info

block

@cnippet/v-breadcrumb-11

File path breadcrumb with folder and file icons in monospace

block

@cnippet/v-breadcrumb-12

Checkout step progress breadcrumb with numbered circles and navigation buttons

block

@cnippet/v-breadcrumb-13

Admin hierarchy breadcrumb with colored icon badges per level

block