Skip to content
gauchocodeUI GALLERY
LIBRARY
All blocks58Data display15Navigation & shell14Forms & actions7Planning12Feedback & overlays4AI & automation4Apps & admin2
RESOURCES
CommunityTeam library
GC
GauchoCodeEngineering & design
v0.1
WorkspaceUI Gallery
CommunityTeam library
BlocksNavigation & shellTabs with counts

Tabs with counts

Adapted

The same quiet rail with optional numeric indicators at the right of each label.

TabsCountsStates
React · CSS
Origin & adaptation notes

Adapts the current TukiMate contact detail tab rail with optional numeric indicators: badges sit at the right of the label, tint with the selected state, and tabs without a count render without one. The selected tab picks up the brand color while unselected tabs stay muted and hover lifts them partway. Counts are synthetic.

Curated adaptation. Synthetic data only. No production APIs.

PreviousContact detail tabsNextTabs
Built with intention. Shared with the team.GauchoCode UI Gallery ✳