Catppuccin Android Library

Catppuccin Android Library provides a fast and easy way for Android Developers to implement Catppuccin pastel theme in Android Applications.

💭 Library structure

The library is divided into separate modules, so you can implement only those that you need in your app for certain feature implementation.

To implement this library, add jitpack.io repository in your project level build.gradle:

buildscript {
    repositories {
        maven { setUrl("https://jitpack.io") }
    }
}

Then add all or only needed library module dependencies to your module level build gradle:

dependencies {
    implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:palette:<VERSION>'
    implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:palette-legacy:<VERSION>'
    implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:compose:<VERSION>'
    implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:splashscreen:<VERSION>'
}

Palette

Implements Catppuccin color compose palette:

• Catppuccin.Latte
• Catppuccin.Frappe
• Catppuccin.Macchiato
• Catppuccin.Mocha

implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:palette:<VERSION>'

Palette Legacy

Available since version 0.1.1

Implements Catppuccin color palette as xml resources and static colors that can be accessed without context:

• CatppuccinLegacy.Latte
• CatppuccinLegacy.Frappe
• CatppuccinLegacy.Macchiato
• CatppuccinLegacy.Mocha

implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:palette-legacy:<VERSION>'

Compose

Implements Android Jetpack Compose Catppuccin material themes.

implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:compose:<VERSION>'

Splashscreen

Implements basic XML themes for androidx.core.core-splashscreen library:

• Theme.Catppuccin.Latte.SplashScreen
• Theme.Catppuccin.Frappe.SplashScreen
• Theme.Catppuccin.Macchiato.SplashScreen
• Theme.Catppuccin.Mocha.SplashScreen

implementation 'com.github.ShiftHackZ.Catppuccin-Android-Library:splashscreen:<VERSION>'

👾 Examples

Palette

To pick needed color from the Catppuccin Palette call Catppuccin.<Flavor>.<Color>, for example:

@Composable
fun RedText(text: String) {
    val color = Catppuccin.Frappe.Red
    Text(
        text = text,
        color = color,
    )
}

Palette Legacy

To access a color in XML or programatically with context, use catppuccin_<flavor>_<color>:

<View
    android:color="@color/catppuccin_frappe_sub_text_1"
    />

<View
    android:color="@color/catppuccin_frappe_red"
    />

Or you can access it with context like this:

import com.shifthackz.catppuccin.palette.legacy.R as CatppuccinRes

...
val color = ContextCompat.getColor(context, CatppuccinRes.catppuccin_frappe_red)
...

In case you need a color represented as Int value (or simply don't want to use context) you can access the color by call CatppuccinLegacy.<Flavor>.<color>:

val color = CatppuccinLegacy.Frappe.red

Compose material themes

Themes overview

To pick needed theme form Catppuccin material themes call CatppuccinTheme.<Theme>, there are 3 available themes:

• CatppuccinTheme.DarkLightPalette - takes two Catppuccin Paletes for dark and light mode and handles theming.
• CatppuccinTheme.Palette - takes Catpuccin Palette and handles theming.
• CatppuccinTheme.Custom - allows to define theme with fully custom ColorScheme, Typography, Shapes.

To theme the whole application, you can follow this example code in your Activity:

class CatppuccinActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            CatppuccinTheme.Palette(
                palette = Catppuccin.Frappe,
            ) {
                 // Put your composable content here.
            }
        }
    }
}

Theme Palette customization

There is a quick way to customize theme palette with certain main material colors (primary, secondary, etc).

For this purpose construct your palette by call CatppuccinMaterial.<Flavor>(), for example:

class CatppuccinActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            CatppuccinTheme.Palette(
                palette = CatppuccinMaterial.Frappe(
                    primary = Catppuccin.Frappe.Blue,
                    secondary = Catppuccin.Frappe.Lavender,
                )
            ) {
                 // Put your composable content here.
            }
        }
    }
}

Splashscreen

The splashscreen module implements basic Catppuccin styles to theme androidx.core.core-splashscreen library.

Core splashscreen documentation can be found here: https://developer.android.com/develop/ui/views/launch/splash-screen

To define your custom your custom Splash theme, you can set as a parent Theme.Catppuccin.<Flavor>.SplashScreen, there are 4 themes available:

• Theme.Catppuccin.Latte.SplashScreen
• Theme.Catppuccin.Frappe.SplashScreen
• Theme.Catppuccin.Macchiato.SplashScreen
• Theme.Catppuccin.Mocha.SplashScreen

Example of SplashTheme:

<style name="Theme.App.Starting" parent="Theme.Catppuccin.Frappe.SplashScreen">
    <item name="windowSplashScreenAnimatedIcon">@drawable/catppuccin</item>
    <item name="windowSplashScreenAnimationDuration">500</item>
    <item name="postSplashScreenTheme">@style/Theme.Catppuccin</item>
</style>

Then define this theme in android:theme attribute in AndroidManifest.xml inside or tag, for example:

...
<application
    ...
    android:theme="@style/Theme.Catppuccin.Splash">
    ...
</application>
...

❤️ Gratitude

Thanks to the Catppuccin community for this amazing soothing pastel theme which is the only theme that is pleasant to my eyes.

Copyright © 2023-present Dmitriy Moroz, Catppuccin Org