Photo by Hu Chen on Unsplash
Create beautiful web experiences.
Complexity is the the enemy of productivity.
Natura11y is an open source front-end toolkit. It removes technical barriers for those with limited time or resources. Natura11y's uncomplicated codebase makes it ideal for real-world, time-sensitive projects.
Files at a Glance
Compared to other front-end frameworks, Natura11y's source code is diminutive. Less code equals less technical debt. Figure 1 below is a generalization Natura11y's folder and file structure.
Notice the /src/modules directory shown above in Figure 1, line 8. It contains Natura11y's modules. Each module (e.g., accordion) is a directory that contains two files: _style.scss and index.js. In this way, styles (CSS) and functionality (JS) reside together for each module.
These files are two of the three dependencies required to use Natura11y. The third dependency is for icons. Follow the Quick Start instructions below for including these dependencies (via CDN).
Get up and running with Natura11y. Create a plain HTML document and add the code from Figure 2 (below).
On the HTML tag, the
CDN Stylesheet link to Natura11y Icons, our very own open-source icon library.
CDN link to the framework's latest stable version of the core stylesheet.
That's it! With the the required scripts in place, you are ready to start building with the Natura11y. Next, learn how to customize your layout's look and feel.