Tile UISolid
Source code

Tile UI · SolidJS

CSR · SSR · SSG

Skeleton

A SolidJS loading placeholder hidden from assistive technology by default.

import { Skeleton } from '@tile-ui/solid';
export default function SkeletonDemo() {
	return (
		<div class="component-preview__stack" role="status" aria-label="Loading profile">
			<Skeleton style={{ height: '2.5rem', width: '2.5rem', 'border-radius': '999px' }} />
			<Skeleton style={{ height: '1rem', width: '14rem' }} />

Use Skeleton to reserve layout while content loads.

Registry install

pnpm dlx shadcn@latest add @tile-ui/skeleton

Package usage

import { Skeleton } from '@tile-ui/solid';

<Skeleton />

Highlights

  • Pulse animation
  • Sizes to its container
  • Composes inside Card and Table

Registry dependencies

Item Purpose
skeleton Component source and module styles
core Framework-agnostic logic helpers
styles Shared SCSS tokens and globals

API reference

Skeleton

No custom props.