About two months ago we launched the CodyHouse Framework and Components. The framework is the engine that powers up the whole (new) Design System section. The components library is a growing arsenal of accessible HTML, CSS, JS assets. Framework and components work together. As soon as the number of components becomes significant, developers will have a great resource to kick off any web project.
🔥 Today we're thrilled to introduce another resource: the Global Editors.
The Global Editors are web design tools that allow you to set the style of typography elements, color themes, spacing rules, buttons, and forms directly in the browser. They generate SCSS code that is compatible with the CodyHouse framework.
Working with the Editors is as simple as 1) use the tools to edit the globals, 2) copy the SCSS, 3) paste it into the framework.
To strengthen even more the connection between globals and components, when you save your changes in one of the Global Editors, all the components are updated with the new style.
Learn more about what each editor can do:
1) Colors Editor #
The Color Editor is a web design tool that generates color palettes and themes.
2) Typography Editor #
The Typography Editor is a tool that helps you to set the typography of your web project.
3) Spacing Editor #
The Spacing Editor is a web design tool that allows you to create a spacing system in SCSS.
4) Buttons Editor #
The Buttons Editor is a web design tool that allows you to design and export a system of SCSS buttons.
5) Forms Editor #
The Forms Editor is a web design tool that allows you to design and export form elements for your web project.
What's next? #
The next step is going to be populating the components library. We plan to grow this section into a huge collection! In the meantime, we'll keep improving the tools we've built. Thanks to the feedback and bug reports you're sending to us via email. You're helping us understand where we should focus our efforts 🙏.
