Scalar UI
Marketing UIApp UIAIChartsBackgrounds
Sign inGet started
Scalar UI
Scalar UI© 2026 Scalar Limited

React · Tailwind CSS · Motion

Browse

HomeAll components 213

Collections

Marketing UI 107App UI 94AI 16Charts 45Backgrounds 2Text 43

More

Text 43

Getting started

Installation

Primitives

AccordionsAlert DialogsAlerts2Aspect RatiosAvatars2BadgesBreadcrumbsButton GroupsButtons2CalendarsCheckboxesCollapsiblesComboboxesCommand MenusContext MenusDate PickersDialogsDropdown MenusEmpty StatesFields2FormsHover CardsInput OTPInputs3KbdMenubarsNavigation MenusPaginationPassword InputsPopoversProgress2Radio GroupsResizableScroll AreasSelectsSeparatorsSheetsSkeletonsSlidersSpinnersSwitchesTablesTabsToastsToggles2ToolbarsTooltipsSortablesStatus DotsTree ViewsFile UploadsSteppers

Layouts

SidebarsNavbarsApp Shells

Blocks

SchedulersBoards3CanvasesWorkflowsAI apps4Developer tools3AuthenticationOnboardingSettingsPricing & upgrades2Help & feedback4System pages7Admin console

Other

Cards

Resources

Docs & installScalar Design
App UIPrimitives

Tables

Table parts in plain, card and striped styles with compact density, sortable headers, selectable rows and a sticky header.

PreviousSwitchesNextTabs

On this page

PlainStripedSelectableSortableSticky Header

Table

lucide-react

Plain

variant="plain" with a caption, for tables inside a page.

Striped

variant="striped" with density="compact" for logs.

Selectable

Checkbox column; selected rows tint via data-state.

Sortable

sort and onSort turn a header into a sort button.

Sticky Header

TableHeader sticky stays put while the body scrolls.