fluent_design.js

A JavaScript library offering Custom Elements based on Microsoft's new Fluent Design system

Installation

<script type="module" src="path/to/fluent_design.js/src/design.js">

And that's it! You're ready to start using Fluent elements in your pages.

Usage

<fl-icon>

Using a Fluent Icon allows you to use any icon available in the UWP icon font only available on Windows 10. For a full list of icons see Microsoft's Fluent documentation.

Attributes

<fl-titlebar>

The Fluent TitleBar provides a way to have a Win10 looking top nav that includes a history back button as well as the minimize, maximize, and close <fl-icon>s

Attributes

Acknowledgements

• Based on Fluent Design by Microsoft
• Thanks to browser devs for making Custom Elements and JS Modules

License

This project is licensed under the Apache 2 License - see the LICENSE file for details