HTWOO UI is an open source alternative for Microsoft's Fluent UI Web Design system. Despite being ReactJS exclusive this project offers a style guide based on HTML and CSS to create implementations for other frameworks as well.

Don't get set into one form, adapt it and build your own, and let it grow, be like water. Empty your mind, be formless, shapeless — like water. Now you put water in a cup, it becomes the cup; You put water into a bottle it becomes the bottle; You put it in a teapot it becomes the teapot. Now water can flow or it can crash. Be water, my friend. - Bruce Lee)

You will find a complete list of assets in the Style Guide.

• hTWOo usage in 'No framework' web part with SPFx
• hTWOo usage in React web part with SPFx
• more documentation coming soon

In the end it always comes down to HTML/CSS no matter which framework you use for your development. HTML/CSS documented components serve no other longevity than any other framework. HTML and CSS can also be easily translate, included and embedded in any other development framework.

HTML/CSS UI components can also be easier optimized, refactored or visually enhanced.

hTWOo style guide, documentation and building platform is based on patternlab.io. To allow the most flexible implementation of designs and design pattern it follows the Atomic Design Methodology coined by Brad Frost around 2012 / 2013.

We're tasked with making interfaces for more users in more contexts using more browsers on more devices with more screen sizes and more capabilities than ever before. That's a daunting task indeed. Thankfully, design systems are here to help. - Brad Frost

Follow us on Twitter @htwooui.

Maintainer: Stefan Bauer (N8D), Julie Turner

Contributor: You ❤️