Android Academy · Lesson

Colors and MaterialTheme

Apply consistent theming.

Colors and MaterialTheme is a free Android Academy lesson on CoddyKit — lesson 4 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Android Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

Colors in Compose

Compose represents colors with the Color class. There are ready-made values like Color.Red and Color.Blue.

You pass a Color to parameters such as a Text color or a background.

Text(
    text = "Hi",
    color = Color.Blue
)

Custom Color Values

Make any color from a hex code using Color(0xFFRRGGBB). The first two digits, FF, mean fully opaque.

For example, 0xFF6200EE is a purple.

val purple = Color(0xFF6200EE)
Text("Brand", color = purple)

Background Color

Use the background modifier to paint behind a composable. Add padding so the content does not touch the edges.

Order matters: background then padding fills the padded area.

Text(
    text = "Box",
    modifier = Modifier
        .background(Color.Yellow)
        .padding(8.dp)
)

What Is MaterialTheme?

MaterialTheme is a system that holds your app's colors, fonts, and shapes in one place.

Composables read from it so your whole app stays consistent and easy to restyle.

MaterialTheme {
    Text("Themed app")
}

Theme Color Scheme

The theme's colorScheme provides named roles like primary, secondary, and background.

Reading these instead of fixed colors lets you change the look in one spot.

Text(
    text = "Primary",
    color = MaterialTheme.colorScheme.primary
)

Primary and onPrimary

Each main color has an on partner for text drawn over it, like onPrimary.

Using primary as a background and onPrimary as text guarantees readable contrast.

Box(
    Modifier.background(MaterialTheme.colorScheme.primary)
) {
    Text("Label", color = MaterialTheme.colorScheme.onPrimary)
}

Theme Typography

MaterialTheme also stores text styles in typography, such as titleLarge and bodyMedium.

Pass one to a Text style for consistent, well-sized text.

Text(
    text = "Heading",
    style = MaterialTheme.typography.titleLarge
)

Light and Dark Schemes

You can build a scheme with lightColorScheme() or darkColorScheme() and pass it to MaterialTheme.

Switching schemes lets your app support both light and dark modes.

MaterialTheme(
    colorScheme = darkColorScheme()
) {
    Text("Dark mode")
}

Customizing the Scheme

Override roles by naming them when you build a scheme. Here primary becomes a custom teal.

Everything that reads colorScheme.primary updates automatically.

val scheme = lightColorScheme(
    primary = Color(0xFF018786)
)

Why Use the Theme?

Hardcoding colors everywhere makes redesigns painful. Reading from MaterialTheme means one change updates the whole app.

It also helps accessibility, since on-colors keep good contrast.

Surface and Background

The Surface composable applies a theme background color and elevation behind its content.

It is a clean way to give a card or screen the right base color.

Surface(
    color = MaterialTheme.colorScheme.background
) {
    Text("On surface")
}

Quick Check

Test your knowledge of colors and theming.

Recap

You learned to use the Color class, custom hex colors, and the background modifier. MaterialTheme groups colorScheme, typography, and shapes.

Reading roles like primary and onPrimary keeps contrast and consistency, and supports light or dark schemes.

Great work finishing the styling course!

Frequently asked questions

Is the “Colors and MaterialTheme” lesson free?

Yes — the full text of “Colors and MaterialTheme” is free to read here on the web, and the Android Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Android Academy course, upgrade to CoddyKit PRO.

What will I learn in “Colors and MaterialTheme”?

Apply consistent theming. You practise Android Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start Android Academy?

No prior experience is required. Android Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 4 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “Colors and MaterialTheme” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this Android Academy lesson?

Yes. Every Android Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

← Back to Android Academy