Spark Android Design System

Spark Design System is based on Material 3 Compose artifact described on the official documentation and maintained by Google developers and designers.

But these native components and tokens are overridden to respect Spark's Visual Identity. You'll find the design specifications and technical information for supported platforms by Adevinta on spark.adevinta.com.

Build and install the catalog app locally to browse all components:

./gradlew :catalog:installDebug

🚀 Getting Started

A SparkTheme is available from where you can get all colors, typographies and shapes in your composable hierarchy. Note that this theme is mandatory if you want to use any Spark composable. Otherwise, a runtime error will be thrown.

SparkTheme {
    // Your composable declarations
}

Installation

Add the main Spark dependency:

dependencies {
    // Import the Spark BoM
    implementation(platform("com.adevinta.spark:spark-bom:<version>"))

    // Declare dependencies without versions
    implementation("com.adevinta.spark:spark")
    implementation("com.adevinta.spark:spark-icons")
}

Usage

Applying the theme

Wrap your content in SparkTheme. Any Spark composable used outside it throws a runtime error.

SparkTheme {
    // Your composable hierarchy
}

Custom colour palette

Pass lightSparkColors and darkSparkColors to override the default palette. Supply only the tokens you want to change; the rest fall back to Spark defaults.

val myLightColors = lightSparkColors(
    accent = Color(0xFF6200EE),
    onAccent = Color.White,
)
val myDarkColors = darkSparkColors(
    accent = Color(0xFFBB86FC),
    onAccent = Color.Black,
)

SparkTheme(
    colors = if (isSystemInDarkTheme()) myDarkColors else myLightColors,
) {
    // content
}

Feature flags

SparkFeatureFlag gates opt-in behaviour such as rebranded shapes and development highlighters. Construct it once and pass it to SparkTheme.

SparkTheme(
    colors = myColors,
    sparkFeatureFlag = SparkFeatureFlag(
        useRebrandedShapes = true,
        isContainingActivityEdgeToEdge = true,
    ),
) {
    // content
}

Icons module

The spark-icons artifact ships separately from the core module. Add both in the same BoM block:

dependencies {
    implementation(platform("com.adevinta.spark:spark-bom:<version>"))
    implementation("com.adevinta.spark:spark")
    implementation("com.adevinta.spark:spark-icons")
}

Theming and tokens

A full guide to the colour intent system, custom palettes, shape and typography tokens, and SparkFeatureFlag is in docs/theming.md.

API reference

Full KDoc is published at adevinta.github.io/spark-android.

---

Upgrading

See UPGRADING.md for migration guides when updating across breaking versions.

Contributing

Please take a look at the contribution guide to setup your dev environment and get a list of common tasks used in this project, as well as the Code of conduct.

License

Copyright (c) 2023 Adevinta

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.