UI component library explorer
Gardenjs promotes modular and reusable code, streamlines collaboration between team members and increases overall productivity. Gardenjs is MIT licensed and free.
«Building a frontend is like gardening. Grow your components and layouts, maintain them and control their growth. Build great products and reap the rewards of your work!»
Why Gardenjs?
Gardenjs supports efficient frontend development with its intuitive user interface, easy integration into projects and super-fast execution.
Speed of light
Gardenjs starts almost instantly within 2s. In action, code changes in Gardenjs are reflected by the Vite build tool at the speed of light — significantly faster than Storybook or comparable tools.
Fast and efficient handling
Gardenjs offers simple configuration and ensures the uncomplicated, fast and efficient integration of components in Gardenjs.
Use your favorite framework
Use Gardenjs out of the box with Svelte, Vue and React. If you want to use a previously unsupported framework and template language, you can write a plugin with little effort, so that your components are rendered in Gardenjs as well. Please support us to integrate more frameworks.
Multi-framework compatible
You can also use Gardenjs in a multiframework project by adding another renderer plugin - Storybook and others cannot.
Hooks
With Gardenjs, you can integrate hooks into your components as a versatile and effective way of creating state and effect logic.
Decorators
Components can be extended and customized with Decorators to add additional features and behaviors in Gardenjs - without changing the actual code of the component.
The sleek good-looking alternative
The efficient integration into your framework, numerous features and a clearly organized, beautiful interface make working with Gardenjs a real experience.
Open source and free
Gardenjs is open source and can be used free of charge. We are of course still happy to receive support.
Your benefits
Gardenjs supports efficient frontend development with its intuitive user interface, easy integration into projects and super-fast execution.
Organisation
Keep track of the countless components left in large projects and ensure the quality of your work. You can also output an external local library within a project.
Usability
A well thought-out concept, simple operation and numerous small features help to make everyday development work easier.
Representation
Preview components in different viewport sizes and rotations or in a separate browser window. The size of the stage is shown in pixel size.
Collaboration
Publish your component libraries inside your team or to public to simplify collaboration between designers and developers.
Examples
Write examples to showcase and document your components. Output all versions and states of your components.
Documentation
Add any additional information to your components and examples and keep track of all components and for the whole team.
Would you like to get involved?
Gardenjs is published under the MIT license and free to use. We are therefore particularly pleased about your support.
Support us
You can support us by using Gardenjs, writing a plugin for a new framework (which we will then gladly point out), reporting bugs, giving feedback, making a contribution or writing documentation. We look forward to your support.
Make a donation
A donation and sponsoring model is planned if Gardenjs is well received. A list of possible future features can be found in the documentation. Please contact us if you would like to sponsor one of the features.
