Vetra UI

A Modern, Elegant UI Design System for Compose Multiplatform

Building delightful experiences with light, depth, and motion

English | 简体中文

Features

Cross-Platform

• Support Android iOS JVM and Web

Developer Friendly

• API design similar to Material Design for low learning curve
• Clear naming conventions and comprehensive documentation
• Rich Preview examples for every component

Lightful UI

• Elegance over Flash: No effects for effect's sake—every animation serves a purpose
• Unity over Variety: Consistent design language reduces cognitive load
• Natural over Mechanical: Motion follows physics, interactions follow intuition
• Clarity over Abstraction: Intuitive naming, predictable APIs

Quick Start

Installation

Add dependency in libs.versions.toml:

[versions]
vetraui = "1.0.0-alpha03"

[libraries]
vetraui-core = { module = "com.flyfishxu.vetraui:core", version.ref = "vetraui" }

In your build.gradle.kts:

commonMain.dependencies {
    implementation(libs.vetraui.core)
}

Basic Usage

import com.flyfishxu.vetraui.core.theme.VetraTheme
import com.flyfishxu.vetraui.core.components.*

@Composable
fun App() {
    VetraTheme(darkTheme = false) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(24.dp),
            verticalArrangement = Arrangement.spacedBy(16.dp)
        ) {
            // Button
            VetraButton(onClick = { /* ... */ }) {
                Text("Get Started")
            }
            
            // Card
            VetraCard {
                Text("Beautiful content in a refined container")
            }
            
            // TextField
            VetraTextField(
                value = searchText,
                onValueChange = { searchText = it },
                placeholder = "Search..."
            )
        }
    }
}

LICENSE

VetraUI is MIT licensed.

---

Example App · Report Bug · Contributing