AAaabbcc1241·Sep 4, 2022Submission
Lona – A compiler approach to design and build cross-platform UI
5 points · Open discussionLona
Lona
Swift2017–2022
Lona / Lona
Lona
A tool for defining design systems and using them to generate cross-platform UI code, Sketch files, and other artifacts.
7Distinct people
9Mentions
0Explicit recommenders
7.5KGitHub stars
What to know before exploring
What it is
A tool for defining design systems and using them to generate cross-platform UI code, Sketch files, and other artifacts.
GitHub
Where it is used
No documented product use has been verified yet.
What people are saying
No recommendation phrase was found in the indexed comments.
No classified warning is attached to this page. Read the discussions before treating silence as approval.
Also in these discussions
No other repository is repeatedly linked in the same discussions.
This week on Hacker News
Nov 7–Nov 14 UTC · Direct repository links and separately labeled related project stories. Indexed through 11/14/2026, 5:04:57 PM UTC.
No direct repository links were found in the indexed HN discussions over the past seven days. Older discussions are available below.
Mentions over time
HN mentions by year9 dated mentions
Observed mentions: 2017-11-22 09:52:13 UTC to 2022-09-04 23:53:25 UTC.
Counts come from the repository’s dated source evidence. Index cutoff: 2026-11-02 08:16:59 UTC.
View mention counts and date ranges
| Period | Start (UTC) | End (exclusive, UTC) | Mentions | Submissions | Comments |
|---|---|---|---|---|---|
| 2017 | 2017-01-01 00:00:00 UTC | 2018-01-01 00:00:00 UTC | 3 | 3 | 0 |
| 2018 | 2018-01-01 00:00:00 UTC | 2019-01-01 00:00:00 UTC | 2 | 0 | 2 |
| 2019 | 2019-01-01 00:00:00 UTC | 2020-01-01 00:00:00 UTC | 2 | 0 | 2 |
| 2020 | 2020-01-01 00:00:00 UTC | 2021-01-01 00:00:00 UTC | 1 | 1 | 0 |
| 2021 | 2021-01-01 00:00:00 UTC | 2022-01-01 00:00:00 UTC | 0 | 0 | 0 |
| 2022 | 2022-01-01 00:00:00 UTC | 2023-01-01 00:00:00 UTC | 1 | 1 | 0 |
What Hacker News says
9 sourcesLona – define design systems and use them to generate cross-platform UI code
4 points · Open discussionSurprised it’s Vue and not React. Vue is great, but there’s a lot of activity in the Sketch <-> React space, for example AirBnb’s Lona [0]. This could fit in nicely.
[0] https://github.com/airbnb/Lona
In Show HN: I trained a deep learning model to build sites for meIt’s a pity they’ve shut down, though hopefully it can live on somehow as open source.
There’s a lot of activity in the Sketch/Figma/whatever to React space at the moment, including Hadron [0], Alva [1] and Lona [2].
There’s a real gap in the workflow between design - basically a drawing - and working code. Handoff tools like Zeplin help, but it seems redundant to build everything twice, first in a design and prototyping tool, then again in working code.
However I’m not sure where these tools fit in, as a team that uses React in production would have the skills - and would probably prefer - to dive in with code, rather than use the output of a code generator.
It’s meant to make things easier, but the tech is so complicated it’s way out of reach of those who might actually benefit from it.
[0] https://hadron.app
[1] https://meetalva.io
[2]
Read the rest
we have a new tool that we're trying internally to design cross-platform components - https://github.com/airbnb/Lona
pretty early still, but the idea is that short-term it generates assets that fit into our existing Figma / Sketch product design workflows for consumption. having a cross-platform source of truth for _components_ is higher impact than outputting their _consumption_. this was mostly the reason we first did the things we wrote about here - they laid the groundwork for Lona and a more component-centric design process.
https://airbnb.design/painting-with-code/
https://airbnb.design/sketching-interfaces/
https://airbnb.design/the-evolution-of-tools/
In React Native at AirbnbThe problem is that our design tools are not good enough. Sketch combined with a handoff tool like Zeplin is lightyears ahead of Photoshop for web and app design, but fundamentally, at heart, it's a draw program. You make a page, draw a bunch of boxes and call it a website.
It's not. It's a page layout. But websites and apps aren't pages, they're dynamic systems built from interactive components with multiple states and screen sizes.
All visual web builders do is replicate traditional drawing tools, but output to HTML/CSS rather than Postscript or bitmaps. This is not enough, except for the most basic of brochure sites.
There's still a massive gap between designs and working code. Some things that are easy to do in Sketch are tough in code and vice versa - it's too easy to do things that become problems later. And because it's static imag
Read the rest
es, it's not easy to show live data or interactions.
Prototyping tools like Framer and Flinto can help here, but again, it's never a true representation of what can actually be done in code.
For both layout and interaction, the developer has to recreate something that's already been created - it's an inefficient process, and one that go wrong unless the design team thoroughly understands the systems they're designing for and can know the consequences of their design decisions.
I've seen it happen many times where developers struggle to implement something that the designer did quickly without really thinking about. Not the designer's fault - just falling down the gap between design tools and medium. And not enough collaboration between the teams.
There is some really cool stuff on the horizon however. React, and the move towards component-based design and development is making this possible. But it's early days.
Supernova Studio [0] is an interesting start, along with Alva [1] and AirBnb's Lona[2].
[0] https://supernova.studio
[1] https://meetalva.io
[2] https://github.com/airbnb/Lona
Generate cross-platform UI code, Sketch files, images, and other artifacts
1 points · Open discussionAirBnB Lona: generate Sketch files, code and other assets from a design system
1 points · Open discussion