Preview UI components in your IDE

Compatible with React 16+, SolidJS, Vue 2 and Vue 3
Get started

Instant feedback

See your code live within the blink of an eye

Preview.js uses Vite and esbuild to achieve snappy refreshes, typically on the order of milliseconds.

Better yet, previews are updated as you type!

No boilerplate

Preview any component

Preview.js detects your components and lets you preview each individually, with little to no configuration.

Component properties are automatically generated to match detected TypeScript types.

Cross-framework

Supports Vue.js 2+, React 16+ and Solid

Preview.js leverages the power of Vite to support React and Vue.js.

It also supports application frameworks such as Next.js and Nuxt.js.

Support for Preact and Svelte coming soon!

Open source edition

Free and open source

Preview.js is open sourced under the AGPL v3 license.

It includes:

  • support for all frameworks
  • instant preview as you type
  • live props editor
  • automatic props generation for typed components
  • Storybook support
  • error handling

Professional edition

Get avanced features with Preview.js Pro

Support Preview.js development by purchasing a Preview.js Pro license.

Preview.js Pro includes:

  • quick preview of related Storybook stories
  • viewport preview (mobile, tablet)
  • dark background toggle
  • component search
  • and more features in the works!

For more details, check out the Pro comparison table.

Pick your IDE

Available for Visual Studio Code and IntelliJ / WebStorm

Preview.js works out of the box with:

  • Visual Studio Code
  • IntelliJ, WebStorm and other JetBrain IDEs

All IDE integrations are also open source!

Try Preview.js