[{"slug":"ai-tools","title":"Use with AI tools","description":"Query typestyles documentation from LLM crawlers, coding agents, and chat assistants","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/ai-tools.md","htmlUrl":"https://typestyles.dev/docs/ai-tools"},{"slug":"animation-patterns","title":"Animation Patterns","description":"Common animation patterns and techniques with typestyles","category":"Examples","mdUrl":"https://typestyles.dev/docs/animation-patterns.md","htmlUrl":"https://typestyles.dev/docs/animation-patterns"},{"slug":"api-reference","title":"API Reference","description":"Complete API reference for typestyles","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/api-reference.md","htmlUrl":"https://typestyles.dev/docs/api-reference"},{"slug":"atomic-css","title":"Atomic CSS Utilities","description":"Type-safe atomic CSS utilities with @typestyles/props","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/atomic-css.md","htmlUrl":"https://typestyles.dev/docs/atomic-css"},{"slug":"benchmarks","title":"Benchmarks","description":"Reproducible performance measurements for TypeStyles — CSS generation, file size, runtime injection, SSR collection, and cross-framework comparison","category":"Guides","mdUrl":"https://typestyles.dev/docs/benchmarks.md","htmlUrl":"https://typestyles.dev/docs/benchmarks"},{"slug":"best-practices","title":"Best Practices","description":"Tips for organizing and maintaining typestyles in your project","category":"Guides","mdUrl":"https://typestyles.dev/docs/best-practices.md","htmlUrl":"https://typestyles.dev/docs/best-practices"},{"slug":"cascade-layers","title":"Cascade layers (@layer)","description":"Opt-in CSS cascade layers for predictable specificity against global CSS","category":"Advanced Features","mdUrl":"https://typestyles.dev/docs/cascade-layers.md","htmlUrl":"https://typestyles.dev/docs/cascade-layers"},{"slug":"class-naming","title":"Class naming","description":"Per-instance semantic, hashed, or atomic class names via createStyles; scoped tokens via createTokens","category":"Advanced Features","mdUrl":"https://typestyles.dev/docs/class-naming.md","htmlUrl":"https://typestyles.dev/docs/class-naming"},{"slug":"color","title":"Color","description":"Type-safe helpers for CSS color functions","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/color.md","htmlUrl":"https://typestyles.dev/docs/color"},{"slug":"component-library","title":"Component Library Setup","description":"Building a reusable component library with typestyles","category":"Examples","mdUrl":"https://typestyles.dev/docs/component-library.md","htmlUrl":"https://typestyles.dev/docs/component-library"},{"slug":"components","title":"Components","description":"Build typed variant APIs with styles.component","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/components.md","htmlUrl":"https://typestyles.dev/docs/components"},{"slug":"compose","title":"Style Composition","description":"Combine multiple style functions and class strings with styles.compose","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/compose.md","htmlUrl":"https://typestyles.dev/docs/compose"},{"slug":"custom-at-rules","title":"Custom Selectors & At-Rules","description":"Using @container, @supports, and other CSS features","category":"Advanced Features","mdUrl":"https://typestyles.dev/docs/custom-at-rules.md","htmlUrl":"https://typestyles.dev/docs/custom-at-rules"},{"slug":"design-system","title":"Design System with Tokens","description":"Building a comprehensive design system using typestyles tokens","category":"Examples","mdUrl":"https://typestyles.dev/docs/design-system.md","htmlUrl":"https://typestyles.dev/docs/design-system"},{"slug":"dynamic-styles","title":"Dynamic styling","description":"Per-instance values with createVar and assignVars — the TypeStyles way to handle dynamic CSS","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/dynamic-styles.md","htmlUrl":"https://typestyles.dev/docs/dynamic-styles"},{"slug":"fonts","title":"Fonts","description":"Loading web fonts with global.fontFace, Vite, and Next.js","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/fonts.md","htmlUrl":"https://typestyles.dev/docs/fonts"},{"slug":"framework-comparison","title":"Framework comparison","description":"How TypeStyles compares to StyleX, Panda CSS, vanilla-extract, Emotion, CSS Modules, and plain CSS—with a shared button example and a topic-by-topic comparison","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/framework-comparison.md","htmlUrl":"https://typestyles.dev/docs/framework-comparison"},{"slug":"getting-started","title":"Getting Started","description":"Install TypeStyles and ship your first typed component styles in a few minutes","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/getting-started.md","htmlUrl":"https://typestyles.dev/docs/getting-started"},{"slug":"keyframes","title":"Keyframes","description":"Create CSS animations with type-safe keyframe definitions","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/keyframes.md","htmlUrl":"https://typestyles.dev/docs/keyframes"},{"slug":"migration","title":"Migration Guide","description":"Migrate to typestyles from other CSS-in-JS libraries","category":"Guides","mdUrl":"https://typestyles.dev/docs/migration.md","htmlUrl":"https://typestyles.dev/docs/migration"},{"slug":"open-props","title":"Open Props","description":"Type-safe access to Open Props CSS custom properties","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/open-props.md","htmlUrl":"https://typestyles.dev/docs/open-props"},{"slug":"performance","title":"Performance","description":"Understanding and optimizing typestyles performance","category":"Guides","mdUrl":"https://typestyles.dev/docs/performance.md","htmlUrl":"https://typestyles.dev/docs/performance"},{"slug":"publishing-packages","title":"Publishing a Package with TypeStyles","description":"Safe defaults and collision-proof patterns for npm-published libraries using TypeStyles","category":"Guides","mdUrl":"https://typestyles.dev/docs/publishing-packages.md","htmlUrl":"https://typestyles.dev/docs/publishing-packages"},{"slug":"react-integration","title":"React Integration","description":"Using typestyles with React patterns and best practices","category":"Examples","mdUrl":"https://typestyles.dev/docs/react-integration.md","htmlUrl":"https://typestyles.dev/docs/react-integration"},{"slug":"ssr","title":"Server-Side Rendering (SSR)","description":"Render typestyles on the server for better performance and SEO","category":"Advanced Features","mdUrl":"https://typestyles.dev/docs/ssr.md","htmlUrl":"https://typestyles.dev/docs/ssr"},{"slug":"style-dictionary","title":"Style Dictionary & W3C tokens","description":"Use TypeStyles alongside the W3C Design Tokens Community Group (DTCG) format and Style Dictionary for a design-tool-to-code pipeline","category":"Guides","mdUrl":"https://typestyles.dev/docs/style-dictionary.md","htmlUrl":"https://typestyles.dev/docs/style-dictionary"},{"slug":"styles","title":"Styles","description":"Create and compose style variants with styles.component","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/styles.md","htmlUrl":"https://typestyles.dev/docs/styles"},{"slug":"testing","title":"Testing","description":"Testing strategies for typestyles components","category":"Guides","mdUrl":"https://typestyles.dev/docs/testing.md","htmlUrl":"https://typestyles.dev/docs/testing"},{"slug":"theming-patterns","title":"Theming Patterns","description":"Light/dark mode, multi-brand theming, and advanced theme strategies","category":"Advanced Features","mdUrl":"https://typestyles.dev/docs/theming-patterns.md","htmlUrl":"https://typestyles.dev/docs/theming-patterns"},{"slug":"tokens","title":"Tokens","description":"Design tokens and theming with tokens.create, createTheme, and color modes","category":"Core Concepts","mdUrl":"https://typestyles.dev/docs/tokens.md","htmlUrl":"https://typestyles.dev/docs/tokens"},{"slug":"troubleshooting","title":"Troubleshooting","description":"Common issues and how to fix them","category":"Guides","mdUrl":"https://typestyles.dev/docs/troubleshooting.md","htmlUrl":"https://typestyles.dev/docs/troubleshooting"},{"slug":"typescript-tips","title":"TypeScript Tips","description":"TypeScript best practices and advanced types for typestyles","category":"Guides","mdUrl":"https://typestyles.dev/docs/typescript-tips.md","htmlUrl":"https://typestyles.dev/docs/typescript-tips"},{"slug":"vite-plugin","title":"Vite Plugin","description":"Enhance your Vite development experience with HMR and style validation","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/vite-plugin.md","htmlUrl":"https://typestyles.dev/docs/vite-plugin"},{"slug":"zero-runtime","title":"Zero-Runtime Build Extraction","description":"How to eliminate the typestyles runtime in production and emit a static CSS file","category":"Getting Started","mdUrl":"https://typestyles.dev/docs/zero-runtime.md","htmlUrl":"https://typestyles.dev/docs/zero-runtime"}]