| Website | skeleton.dev |
|---|
| Size | |
|---|
| Layout | |
|---|
| AppShell | Yes Responsive shell for controlling application layout. |
|---|
| Container | No |
|---|
| Center | No |
|---|
| Dark Mode / Lightswitch | Yes Allows users to toggle between light and dark themes using Tailwind's dark mode feature. |
|---|
| Footer | No |
|---|
| Grid | No |
|---|
| Group | No |
|---|
| MediaQuery | No |
|---|
| Navbar | Yes App Bar : A header element for the top of your page layout. Pairs well with the App Shell. |
|---|
| SimpleGrid | No |
|---|
| Sidebar | Yes App Rail : A side navigation rail component |
|---|
| Space | No |
|---|
| Stack | No |
|---|
| Navigation | |
|---|
| Anchor | No |
|---|
| Breadcrumbs | Yes Displays the current navigation hierarchy. |
|---|
| Burger | No |
|---|
| Drawer (or Off-canvas) | Yes Displays an overlay panel that attaches to any side of the screen. |
|---|
| Pagination | Yes Navigate between multiple pages of content. |
|---|
| Seo | No |
|---|
| Tabs | Yes Use tabs to quickly switch between different views. |
|---|
| Data Display | |
|---|
| Accordion | Yes Divide content into collapsible sections. |
|---|
| Avatar | Yes Display user avatars with an image or initials. |
|---|
| Badge | No |
|---|
| Card | No |
|---|
| Carousel | No |
|---|
| Conic Gradients | Yes Create conic gradient data visualizations for pie charts, loading spinners, and more. |
|---|
| Dot | |
|---|
| Divider | Yes Horizontal or vertical rules for sectioning your content. |
|---|
| Dropdown | No |
|---|
| Image | No |
|---|
| Image Lists / Gallery | No |
|---|
| Kbd | No |
|---|
| List Group | Yes |
|---|
| Popover | No |
|---|
| Rating | No |
|---|
| Table | Yes Utilize a data-driven model to create simple presentational tables. A set of utility features for creating template-driven data tables. |
|---|
| ThemeIcon | No |
|---|
| Timeline | Yes Steppers: Divide and present content in sequenced steps. This Step component uses the locked property, which can prevent progress. |
|---|
| TreeView | No |
|---|
| Typography | Yes Gradient Headings |
|---|
| Video | No |
|---|
| Inputs & Actions | |
|---|
| ActionIcon | No |
|---|
| Autocomplete | No |
|---|
| Button | No |
|---|
| Button Group | No |
|---|
| Checkbox | No |
|---|
| CheckboxGroup | No |
|---|
| Chip | No |
|---|
| FileDropzone | Yes Allow upload of files with drag and drop. |
|---|
| FileInput | Yes FileButton : Allows you to select files with a single click. |
|---|
| Floating Label | No |
|---|
| FormField | No |
|---|
| Input | No |
|---|
| InputWrapper | No |
|---|
| Listboxes | Yes Interactive listboxes that maintain selection state. |
|---|
| NumberInput | No |
|---|
| Radio Button | No |
|---|
| RadioGroup | Yes Capture feedback limited to a small set of options. |
|---|
| Range | Yes Capture input from a range of values, including optional ticks. |
|---|
| Search Input | No |
|---|
| Select | No |
|---|
| Speed Dial | No |
|---|
| Slider | No |
|---|
| Switch Toggle | Yes A sliding toggle element that can capture input from a user. |
|---|
| Textarea | No |
|---|
| TextInput | No |
|---|
| UnstyledButton | |
|---|
| Dates | |
|---|
| DatePicker | No |
|---|
| TimePicker | No |
|---|
| Calendar | No |
|---|
| Feedback | |
|---|
| Alert | Yes Display customizable alerts to garner attention and provide critical actions. |
|---|
| Loading | No |
|---|
| Notification / Toasts | Yes Simple notifications utilizing a dynamic queue system. |
|---|
| Snackbar | No |
|---|
| SnackbarContainer | No |
|---|
| Linear Progress | Yes An indicator showing the progress or completion of a task. |
|---|
| Progress Radials / Circular Progress | Yes Displays a radial indicator showing the progress or completion of a task. |
|---|
| Skeleton | No |
|---|
| Spinner | No |
|---|
| Overlay | |
|---|
| Affix | No |
|---|
| Menu | Yes Provides quick context menus when you tap the trigger element. |
|---|
| Modal | Yes High priority dialogs and modals using a dynamic queue system. |
|---|
| Dialog | Yes High priority dialogs and modals using a dynamic queue system. |
|---|
| Overlay | No |
|---|
| Tooltip | Yes Informative tooltips that render on mouse over. |
|---|
| Utils | |
|---|
| Code blocks | Yes Displays pre-formatted source code, with optional support for Highlight.js syntax highlighting. |
|---|
| Colors | No |
|---|
| Close Button | No |
|---|
| Label | No |
|---|
| Local Storage Store | Yes An extended version of the Svelte writable store that includes pub/sub to local storage. |
|---|
| Toolbar | No |
|---|
| Svelte Actions / Hooks Library | |
|---|
| use-move | No |
|---|
| use-clipboard | Yes Allows you to quickly copy select data to the clipboard. |
|---|
| use-focus-trap | Yes Allows you to contain focus within elements on-demand. |
|---|
| Image Filters | Yes Applies a set of unique SVG filters. Best used with images, but also available to select components, such as Avatars. |
|---|
User reviews and comments