Natura11y is an Open Source Design Ecosystem
Natura11y is more than just a front-end framework—it's a design ecosystem. With Natura11y, you get practical, built-in solutions for some of the most intricate front-end concepts.
Here's what the Natura11y ecosystem includes:
Figma UI Kit
Natura11y's Figma UI Kit provides designers with a suite of tools that bridge the gap between static design systems and dynamic front-end environments.
Every source file for Natura11y is accessible on GitHub. These repositories are home to the core framework, Natura11y's React starter components, and the Natura11y icon library.
Modernized Styles with Natura11y
Natura11y strives to incorporate the most contemporary, browser-friendly CSS specifications. Here are a few foundational features that contribute to Natura11y's CSS:
Natura11y's stylesheet originates from several Sass modules, arranged alphabetically for ease of access.
Natura11y's default font sizes are interrelated, ranging from the smallest to the largest. This simplifies the process of creating balanced typography. You can adjust all font sizes using one or two variables—either at the project level or at a specific breakpoint.Natura11y's Type Scale
Quick Start with CDN
Get started with Natura11y by creating an HTML document using the code provided in Figure 2 (below). This code includes all the necessary CDN links, offering you instant access to Natura11y's ecosystem.
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 all there is to it! With the necessary scripts properly set up, you're all set to start building with Natura11y. Next, explore how to customize the look and feel of your designs.