Share your Compose code across native apps and semantic HTML, with responsive layouts on every platform.

The 0.9.0 demo shares 90.9% of its application source across targets. Built-in sizing, wrapping and adaptive pane APIs let the same feature respond to phone, tablet and desktop space. What the sharing measurement includes.

Documentation · Shopping demo · Playground · API reference

Domposable is a Kotlin Multiplatform UI library with optional integration helpers, built on Compose. Feature teams write regular composables with shared components, modifiers and adaptive layouts. An installed design system provider renders those calls as Compose UI on native targets or semantic HTML on Kotlin/JS. The primary web target is HTML; it does not require Wasm.

[!IMPORTANT] The HTML target is a client-rendered single-page application (SPA), built on Compose HTML. Domposable does not provide server-side rendering (SSR). Route URLs and static hosting entry pages do not render feature content on the server. Hosts such as Kobweb may offer their own static pre-rendering; that is a separate integration, not Domposable SSR.

• Features
• Quick start
• How it works
• Supported platforms
• Examples
• Modules
• Documentation
• Contributing
• License

• Shared feature code — ordinary Compose functions with your models and callbacks.
• Real HTML — headings, links, forms and header/main/footer landmarks, styled with CSS.
• A replaceable design system — scoped brand styles and typed renderers; customize one control or supply a complete provider.
• Adaptive layouts — measure the space a feature receives and choose breakpoints, panes and layout recipes.
• Optional Material design system — standard Material 3 components, selected expressive components and variants, with scoped theme styles. Catalog and configuration.
• Optional screen tooling — manual registration, generated KSP entries, Navigation 3 and browser URL integration when your app needs them.

The supported baseline uses stable Compose Multiplatform core; optional design mappings do not force an alpha core upgrade. See tested versions and upgrade policy.

Your application owns its dependencies and state. Pass an existing ViewModel, use your DI container's Compose integration, or keep state in a composable. Koin and Metro use the same generated entry API; existing frameworks can reuse the generator with their own annotations and hosts.

Build your own visual language with shared layouts and controls, theme an existing provider, or add custom native/HTML renderers and modifier decorations without changing Domposable. Custom design systems keep feature code common across platforms.

[!NOTE] This README describes main. Choose a published version from Releases. Before 1.0, minor releases may change APIs; see the migration guide when upgrading.

Add mavenCentral() and google() to your repositories, then replace <released-version> with a version from Releases.

val domposableVersion = "<released-version>"

kotlin {
    sourceSets {
        commonMain.dependencies {
            implementation("io.github.samuolis.domposable:domposable-design-material:$domposableVersion")
            // Optional: adaptive layout helpers.
            implementation("io.github.samuolis.domposable:domposable-adaptive:$domposableVersion")
        }
    }
}

The Material artifact includes the shared UI API and default platform providers. See the installation guide and tested toolchain for Compose plugins and target setup.

import androidx.compose.runtime.Composable
import io.github.samuolis.domposable.foundation.*
import io.github.samuolis.domposable.material.DomposableMaterialTheme
import io.github.samuolis.domposable.ui.*

@Composable
fun ContactsScreen(onAddContact: () -> Unit) {
    DomposableColumn(
        modifier = DomposableModifier.padding(16.dp),
        gap = 12.dp,
    ) {
        DomposableText("Contacts", style = DomposableTextStyle.Title)
        DomposableButton("Add contact", onAddContact)
    }
}

@Composable
fun App(onAddContact: () -> Unit) {
    DomposableMaterialTheme {
        ContactsScreen(onAddContact)
    }
}

Use Android setContent, iOS ComposeUIViewController, a desktop Compose window or Kotlin/JS renderComposable for HTML. The feature and its callbacks stay in commonMain; the host selects the platform's composition environment. An optional experimental Wasm host is available for Compose UI comparisons.

Platform entry-point examples →

Each Domposable component reads the nearest theme's typed renderer and forwards its values, callbacks and ordered modifier chain. The renderer creates the platform control and connects events back to the feature.

flowchart TB
    Feature[Shared feature composable] --> Components[Domposable component calls]
    Components --> Provider[Installed theme and component provider]
    Provider --> Native[Compose UI: Android, iOS, desktop, Wasm]
    Provider --> HTML[Semantic HTML and CSS: Kotlin/JS]

The same feature can use different element structures and styling on each platform. Set theme colors, typography, shapes and component styles, or replace a renderer for a different control implementation. Component use requires no application KSP setup or navigation registry.

Brand the standard controls once; every argument is optional:

DomposableMaterialTheme(
    colors = brandColors,
    styles = DomposableComponentStyles(
        button = DomposableButtonAppearance(shape = DomposableShape.Circle),
    ),
) {
    FeatureScreen()
}

Use DomposableTheme.styles.button.copy(...) for a local override. Nested themes inherit their enclosing brand values. Styles are composition-scoped, so different parts of an app can use different brands.

Custom cards are shared composition too: use DomposableBox for overlapping image/content layers, a portable gradient for the scrim, and the same theme for controls. Application CSS is an escape hatch for a custom renderer, rather than a requirement for every custom layout. Build a card without CSS · Card and pane demo.

Understand the API → · Customize a design system → · Build adaptive layouts →

Components and adaptive helpers do not depend on the screen registry, navigator or ViewModel adapter. KSP is optional. Your app can use Koin, Metro, another DI container or no DI.

Existing Compose UI widgets cannot run inside an HTML composition. Sharing a feature requires portable component calls or your own native/HTML adapters; this is more than changing imports. Migrate one feature at a time →

HTML and Wasm support optional browser history, hash or path URLs and portable entry-state restoration. HTML collections normally render all keyed items; columns, rows, grids and tables can opt into bounded windowing.

Compatibility, tested versions and platform boundaries →

• Custom components and modifiers: shared component APIs, app-owned CSS/HTML decoration and native drawBehind. Web adapters can also attach CSS and attributes directly.
• Component parameter reference and modifier signatures: generated from the current API.

Explore large collections →

The fictional Fieldwork shop shares its catalogue, cart and feature composables. On the web it uses real links and form controls, with product URLs such as /domposable/shop/products/canvas-weekender/.

The modular shopping example separates catalog and checkout into API and implementation modules. Metro injects entry-owned ViewModels, a composition local supplies typed navigation, and optional KSP generates feature entries. The screen guide also shows manual registration and direct Navigation 3 integration.

Use the pieces your application needs. All artifacts use io.github.samuolis.domposable:<artifact>:<released-version>.

Bug reports and focused contributions are welcome. Start with CONTRIBUTING.md for local setup, validation and maintainer workflows, or open an issue.

PR checks cover ktlint, detekt, Android lint, JVM/Android coverage floors, required binary API checks, packaged consumers, and functional/screenshot tests across native, HTML and Wasm targets. CI keeps reports and captures in GitHub Actions artifacts. API baseline changes need compatibility, migration and version-impact notes.

Apache License 2.0. Copyright 2026 Samuolis.