Live demonstration

rule.motion.purpose-first

reveal

ads-motion-reveal · dur-slow

reveal

Allowed

marketing sections
docs chapters

Prohibited

critical form fields

Performance

Prefer CSS scroll-driven when available

Reduced motion

Static full opacity

@media (min-width: 68rem) { html .shell[data-sidebar-state="collapsed"] { grid-template-columns: var(--docs-rail) minmax(0, 1fr); } html .shell[data-sidebar-state="collapsed"] .sidebar { padding: var(--space-6) var(--space-5); } html .shell[data-sidebar-state="collapsed"] .rail-heading { flex-direction: row; } html .shell[data-sidebar-state="collapsed"] .brand-lockup > span:last-child { display: flex; } html .shell[data-sidebar-state="collapsed"] .desktop-navigation { display: block; } html .shell[data-sidebar-state="collapsed"] .rail-utilities--desktop { display: flex; } html .shell[data-sidebar-state="collapsed"] .sidebar-toggle { display: none; } }