Slint Material Components Tech Preview

Traditionally, UI development took too much time and effort, and iteration and feedback loops were slow. Today it's much better, except in the embedded space, where it feels like we're still stuck in the 2000s.

Slint is our solution to this: Describe your UI with our simple language, iterate quickly with Live-Preview tooling, and finally generate native code with the Slint compiler. Like you'd expect from a modern, cross-platform UI toolkit. All of this not just for desktop and mobile, but also for embedded. For the rest of your application you get to choose your programming language: Slint supports JavaScript, Rust, Python, and C++.

It's now absurdly simple to create custom components. But what if you want to just jump direct to building a product with a set of ready-made components?

In terms of design, there's a great solution already in the market: Google's award winning Material Design 3 system provides a range of battle tested, touch-friendly, customizable components. It's the look and feel you know from Android.

Today, we're proud to announce a tech-preview of Material Design implemented in Slint, giving you everything you need to build your own touch-based products:

• Over 80% of the Material Design components are implemented, including navigation bars, side sheets, switches, and toolbars.
• We're developing this fully in the open on GitHub: https://github.com/slint-ui/material-components
• The entire component set is Open Source, MIT licensed.

🛣️ Roadmap

We aim to release version 1.0 in the coming months, but we'd like to complete a few things first:

• Implement the remaining widgets. Check out our tracking issue.
• Theming: Import your themes from the awesome Material Theme Builder.
• Freezing the API and adding the remaining missing components, such as the date picker or radio buttons.
• More examples and demos

Beyond version 1.0, later this year, we plan to adopt Google's significant design refresh, the new Material Expressive.

Get Started

Don't just take our word for it, try the components out for yourself in this interactive gallery. If you're running Android, download the APK and try it on your phone. We've also cross-compiled the gallery to run in the web browser: https://material.slint.dev/wasm/

To get started with development, check out our documentation: https://material.slint.dev/getting-started/

Before we freeze the API, we'd love your feedback to this early technical-preview. Help us shape the components: Come talk to us, browse our repo, or file issues.

Interactive Gallery