explaingit

composablehorizons/material-3-compose-unstyled

★ 14KotlinAudience · developerComplexity · 3/5Setup · moderate

TLDR

A Kotlin library of Material 3 UI components that work on both Android and desktop, separating visual styling from behavior so components are consistent, accessible, and cross-platform.

Mindmap

mindmap
  root((m3-compose-unstyled))
    Components
      Buttons
      Dialogs
      Text fields
      Progress indicators
      Navigation tabs
    Platforms
      Android
      Desktop
    Key Ideas
      Behavior via Compose Unstyled
      Material 3 visuals
      ARIA accessibility
    Use
      Reference implementation
      Drop in for M3 projects
      Demo scripts
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Build an Android app with Material 3 components that also runs on desktop without visual or behavior differences.

USE CASE 2

Replace standard Material 3 components in a Compose project with accessible alternatives that support keyboard navigation and screen readers.

USE CASE 3

Use the repository as a reference to learn how to build your own custom Compose components on top of Compose Unstyled primitives.

Tech stack

KotlinCompose MultiplatformCompose UnstyledMaterial 3Android

Getting it running

Difficulty · moderate Time to first run · 30min

Requires a working Compose Multiplatform project, the desktop demo needs a JVM and the Android demo needs a connected device or emulator.

In plain English

This is a Kotlin library that provides a set of common app UI components built for Android and desktop applications. It reimplements components from Google's Material 3 design system, which is the visual design language used across modern Android apps, but builds them on top of a separate library called Compose Unstyled rather than the standard Material 3 library. The practical difference is about where behavior and visual styling are defined. Standard Material 3 components bundle both together, and some of their underlying behavior is tied to Android platform conventions. This library separates the two: it keeps the Material 3 visual appearance and color theming, while delegating the component behavior and accessibility logic to Compose Unstyled primitives. The result is components that follow the Material 3 visual specification but work consistently across both Android and desktop targets, and that also comply with W3C ARIA accessibility standards for things like screen readers and keyboard navigation. The components included cover the most common building blocks for an app interface: alert dialogs, buttons, checkboxes, dropdowns, floating action buttons, progress indicators, a modal bottom sheet, text fields, tab rows, radio buttons, sliders, switches, tooltips, and a tri-state checkbox. The repository is intended as a reference implementation showing how to build your own components with Compose Unstyled inside an existing Material 3 project. It includes scripts to run a demo on desktop and on a connected Android device or emulator, so you can see all the components in action before using them in your own app.

Copy-paste prompts

Prompt 1
I want to use the ModalBottomSheet from material-3-compose-unstyled in my Compose Multiplatform project. Show me the Gradle dependency setup and a minimal working code example.
Prompt 2
I need a dropdown component in my cross-platform Compose app. Show me how to integrate the material-3-compose-unstyled Dropdown and customize its Material 3 theme colors.
Prompt 3
Help me run the material-3-compose-unstyled demo on my desktop so I can review all available components before deciding which ones to use in my project.
Open on GitHub → Explain another repo

← composablehorizons on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.