Skapa Digital Design System for Android

Building better digital products for the many

android badge API Level 24 Latest Artifact

This release contains breaking changes.
Follow this migration guide

Skapa for Android is a modern UI library that provides a visual representation with interactive states of the components described on Skapa Design System.

Skapa

Latest release: 2025.10.00-rc02

  • net.ikea.skapa:foundation:3.0.0-rc02 // Colours, Typography, Spacing

  • net.ikea.skapa:design:3.0.0-rc02 // Main components package (30+ components)

  • net.ikea.skapa:icons:3.0.0-rc02 // Contains the approved Skapa Icons from Figma. (500+ icons)

  • net.ikea.skapa.fonts:*:3.0.0-rc02 // Contains the official Skapa Ikea Noto fonts

Hej!

Skapa is a digital ecosystem for us to help each other align, design, develop and ship better IKEA digital products. Read and learn about Skapa in How Skapa works.

About the Digital Design System

Skapa Digital Design System is a collection of guidelines, design and code to support in the creation of user experience and user interface design in all IKEA digital products.

The aim of the design system is to support IKEA co-workers and external suppliers to design and develop digital solutions with greater efficiency and consistency of the IKEA Brand.

Ultimately freeing time so that we can focus on what really matters, creating seamless, friction free and rewarding experiences.

Benefits of using a Design System

  • Save time by easy access to design information, guidelines, designs, code

  • Less time needed to align design decisions and be consistent

  • Save time by enabling reuse of core components

  • Secure level of quality by performing test and audits on accessibility and right to left

Sharing

The design system contains IKEA know-how and is for internal use only. We can share with individuals and companies that have signed a non-disclosure agreement.

📚 Using the Library

Download

Add library dependencies to your app build.gradle.kts file:

Using Skapa BOM package

dependencies {
// Skapa packages using Skapa BOM version
    val skapaBom = platform("net.ikea.skapa:skapa-bom:2025.10.00-rc02")
    implementation(skapaBom)

// Skapa packages
    implementation("net.ikea.skapa:foundation") // Colours, Typography, Spacing
    implementation("net.ikea.skapa:design") // Main components package (50+ components)
    implementation("net.ikea.skapa:icons") // Contains the approved Skapa Icons from Figma (700+ icons)

// Skapa Font packages
    implementation("net.ikea.skapa.fonts:latin") // Included in `Foundation` package
    implementation("net.ikea.skapa.fonts:arabic")
    implementation("net.ikea.skapa.fonts:devanagari")
    implementation("net.ikea.skapa.fonts:chinese-traditional")
    implementation("net.ikea.skapa.fonts:chinese-simplified")
    implementation("net.ikea.skapa.fonts:hebrew")
    implementation("net.ikea.skapa.fonts:japanese")
    implementation("net.ikea.skapa.fonts:kannada")
    implementation("net.ikea.skapa.fonts:korean")
    implementation("net.ikea.skapa.fonts:saudi")
    implementation("net.ikea.skapa.fonts:tamil")
    implementation("net.ikea.skapa.fonts:telugo")
    implementation("net.ikea.skapa.fonts:thai") // Included in `Foundation` package
}
Content copied to clipboard

Without Skapa BOM

// Skapa packages
    implementation("net.ikea.skapa:foundation:3.0.0-rc02")
    implementation("net.ikea.skapa:design:3.0.0-rc02")
    implementation("net.ikea.skapa:icons:3.0.0-rc02")

// Skapa Font packages
    implementation("net.ikea.skapa.fonts:latin:3.0.0-rc02") // Included in `Foundation` package
    implementation("net.ikea.skapa.fonts:arabic:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:devanagari:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:chinese-traditional:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:chinese-simplified:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:hebrew:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:japanese:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:kannada:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:korean:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:saudi:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:tamil:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:telugo:3.0.0-rc02")
    implementation("net.ikea.skapa.fonts:thai:3.0.0-rc02") // Included in `Foundation` package
}
Content copied to clipboard

(Optional: You can download the latest AAR and import the dependency into your project by following these steps here(https://developer.android.com/studio/projects/android-library#psd-add-aar-jar-dependency instead.) )

Requirements

Skapa UI for Android requires at minimum Java 8+ and Android API level 24+.

In order to build and run Compose components you need to use the latest version of Android Studio.

If you are directly referencing an AAR in your project, you will also need to import its dependencies. Skapa library currently depends on the following libraries to work. Add to your app build.gradle.kts file):

val composeBom = "2025.10.00"

dependencies {
    // Compose
    val composeBom = platform("androidx.compose:compose-bom:$composeBom")
    implementation(composeBom)

    // Choose one of the following:
    implementation("androidx.compose.material:material")
    // or skip Material Design and build directly on top of foundational components
    implementation("androidx.compose.foundation:foundation")
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation("androidx.compose.ui:ui")

    // Optional - Integration with activities
    implementation("androidx.activity:activity-compose:X.Y.Z")

    // Android Studio Preview support
    implementation("androidx.compose.ui:ui-tooling-preview")
    debugImplementation("androidx.compose.ui:ui-tooling")
}
Content copied to clipboard

Versioning

Skapa BOM package, online documentation and Skapa Demo app uses Calendar versioning strategy, YYYY.MM.Micro, also used by Androids Jetpack Compose BOM bundles. The Skapa library modules will keep using Semantic versioning also in a similar fashion as Android Jetpack Compose versioning is done.

Documentation

Each component is documented along with its properties. Use the Android Studio built-in documentation viewer to check the details. Guidelines and further information about the components are available at https://skapa.ikea.net/.

Getting started

To see a full list of available components build and run the Example app. For code examples check the live previews in the source files for the component. We encourage you to play around with the live previews by open the skapa/design module in Android Studio.

A quick example to get you started:

import net.ikea.skapa.ui.components.Button
import net.ikea.skapa.ui.components.ButtonVariant
import net.ikea.skapa.foundation.*

@Composable
fun ExampleScreen() {
    var loading by rememberSaveable { mutableStateOf(false) }
    SkapaTheme2(darkTheme = isSystemInDarkTheme()) {
        Surface(color = SkapaTheme.colors.neutral1) {
            Column(horizontalAlignment = Alignment.CenterHorizontally) {
                Text(stringResource(R.string.app_name), style = SkapaTheme.typography.headingL)
                Spacer(modifier = Modifier.height(SkapaSpacing.space50))
                Button(
                    label = stringResource(R.string.button),
                    variant = ButtonVariant.Emphasised,
                    loading = loading,
                    iconId = R.drawable.ic_skapa_allen_key
                ) {
                    loading = !loading
                }
            }
        }
    }
}
Content copied to clipboard

Custom Skapa Lint rules

The Library integrates a custom set of rules that helps to prevent misuse within the component such as not providing content description for an image that might be needed.

import net.ikea.skapa.ui.components.IconButton
import net.ikea.skapa.ui.components.IconButtonVariant
import net.ikea.skapa.foundation.*

@Composable
fun ExampleScreen() {
    var loading by rememberSaveable { mutableStateOf(false) }
    SkapaTheme(darkTheme = isSystemInDarkTheme()) {
        Surface(color = SkapaTheme.colors.neutral1) {
            Column(horizontalAlignment = Alignment.CenterHorizontally) {
                IconButton(
                    R.drawable.ic_skapa_allen_key,
                    contentDescription = null,
                    variant = IconButtonVariant.ImageOverlay,
                    loading = loading
                ) {
                    loading = !loading
                }
            }
        }
    }
}
Content copied to clipboard

Migration guide

Skapa 3.0 for Android brings a lot of deprecations and breaking changes. The reason for this to future-proof our code base to simplify usage, stability, consistency and maintainability. Read more about this on MIGRATION file.

Maintaining & Contributing

Skapa accepts code contributions for Bug Fixes and code Improvements, read more about this on Skapa hub and in CONTRIBUTING file.

Contact us

When onboarded you will get access to our dedicated Android channel on Slack (#support-skapa-designsystem-android) on Ingkas IKEA Enterprise workspace. More information about it here. That's the preferred way for us to be reached.

Reporting issues

If the issue is clear you can create a new issue on Github. If you need us to look into something to clarify, please report at https://skapa.ikea.net/connect with as many details as possible.

All modules:

Link copied to clipboard

Design library contains the coded Skapa Components.

Link copied to clipboard

The Foundation library contains all the foundational tokens that Skapa is built up from such as color, typography, motion and spacing.

Link copied to clipboard

This library provides the most up-to-date Skapa icons as of the release date. You can explore the complete icon collection and find guidance on selecting the appropriate icon for your specific needs here. For further details on Skapa Iconography, please refer to this link.