The open-source Widgetbook is a sandbox for building widgets and screens in isolation. It helps you develop and share hard-to-reach states and edge cases without needing to run your whole app. Inspired by Storybook.js.
Features
- 🧱 Build UI components and pages in isolation. Implement components and pages without needing to fuss with data, APIs, or business logic.
- 👀 Mock hard-to-reach edge cases. Render widgets in key states that are tricky to reproduce in an app. Then save those states as use-case to revisit during development, testing, and QA.
- 📙 Catalog all of your widgets. Create your own widget library providing you with a great overview of what you have already built.
Demo
🎥 Watch a 2-minute demo video from Google's Flutter team.
Getting started
Follow our Setup & Install Guide in our docs.
Widgetbook Cloud
Widgetbook Cloud is a managed hosting solution for Widgetbook that allows you to run golden tests to detect and review all UI changes in your pull-request. Inspired by Chromatic.
Features
- 🌍 Share your Widgetbook with your team. Publish your Widgetbook build for other Developers, Designers, PMs or Clients to reference. Everyone can check that the UI looks right without touching code.
- 🏅 Golden Tests. Run zero-configuration golden tests (visual regression tests) on your widgets across all states, devices, themes, text scale factors, etc. to detect all changes.
- 🧪 Visual Pull Requests. Detect and review all UI changes in your pull-request.
- 🎨 Figma Reviews. Connect your your Figma designs to review your Flutter widget next to the original Figma design.
Demo
🎥 Watch a 1-minute demo video.
Getting started
Widgetbook Cloud has a free tier. Sign up and and follow our docs.
Contributing
Contributions are very welcome!💙 Please check our Contribution Docs.
Libraries
- metadata
- test
- widgetbook
- Widgetbook is a package to build widgets in isolation, test them in different states, and catalogue all your widgets in a single place.