A tool for defining design systems and using them to generate cross-platform UI code, Sketch files, and other artifacts.
This project is in an early stage and lacks documentation – however, with some effort, it can be used very effectively. If you're interested in contributing or using it at your company, feel free to open a GitHub issue or get in touch with me on Twitter @dvnabbott. I'm currently supporting a few early adopters.
Airbnb doesn't provide support for this project. The code and automated tests are not at the same degree of technical rigor as other Airbnb projects.
Lona is a collection of tools for building design systems and using them to generate cross-platform UI code, Sketch files, and other artifacts.
Lona consists primarily of 3 parts:
.component, for cross-platform components
Why Lona? Read more about challenges with cross-platform design systems at scale, and how Lona solves them here.
A design system is defined in JSON as a collection of:
The specification for these files can be found in the docs.
Lona Studio provides a graphical interface for working with
Lona Studio is primarily for building component systems, but can also be used for:
If you have Xcode installed, you can try it out by following the installation instructions.
Wondering if this replaces Sketch? Why a native Mac App? I answer some common questions here in the FAQ.
The Lona Compiler converts .component files to UI code for various targets.
Currently, these targets are supported:
Support is planned for:
The target with the most features currently is Swift. However, it's still fairly rough. If you want to try it out, check out the installation instructions.
If you're looking for a sample of the generated code, check out the test cases