Getting started

Requirements

All of our components are built on top of Compose UI. This means that you can use them in any project that uses Compose (such as Jetpack Compose, Compose Desktop, Compose Multiplatform).

To use them, you need to include the following dependencies in your project:

dependencies {
    implementation("androidx.compose.ui:ui:1.6.10")
}

We also use ComposeTheme library to keep components separated from any design system:

dependencies {
    implementation("com.composables:composetheme:1.1.0-alpha")
}

Some components require the Material Compose 3, as our components we originally focused on Jetpack Compose (Android).

We are currently in the process of moving away from Material Compose, however some components require the following dependency:

dependencies {
    implementation("androidx.compose.material3:material3:1.3.0-beta03")
}

Image Loading

We use Coil Compose for image loading. We use the AddCoilMultiplatform dependency to simplify setup:

// build.gradle.kts
commonMain.dependencies {
    dependencies {
        implementation("com.alexstyl:coilmultiplatform:1.0.0")
    }
}

Add components to your project

We do not distribute any library or dependency of some sort. Instead, we provide the source code of all component examples straight from our website.

  1. Login to your account.
  2. Find the component you need.
  3. Copy the source code of the component and paste it in your project

Resources & Assets

Icons

We use icons from Lucide for the Core UI components converted to Compose Image Vectors using our SVG to Compose tool.

For Material UI we use icons from either the Material 3 or the Material Extended Icons dependency. In the case where a Material symbol is not present in the Material Compose library, we include a converted icon to the example from our Material Symbols Compose collection.

Colors

Examples using Material Compose make heavy use of Material theming and inherit the color of the given theme.

Any other example uses the color palette coming from the ComposeTheme library.

Images

All high-res images used in the component are used from Unsplash.

License Agreement & Privacy

You can read our license agreement by clicking here and our privacy policy by clicking here.