Styles

What it does

When your agent uses it

• Integrate the Jetpack Compose Styles API into an Android project
• Tasks that involve Android development
• Tasks that involve Design systems

Example prompts

• “/styles”

Workflow steps

6 steps, taken from the step headings in SKILL.md.

1. 1Upgrade dependencies
2. 2Configure compiler options to enable experimental API
3. 3Analyze theme structure
4. 4Establish ComponentStyles
5. 5Migrate a component to Styles API
6. 6Validate Changes

What it can do on your machine

Read from SKILL.md and the folder at commit 7c36352. It shows what the files ask for, not the result of running them.

• Tool permissions

  Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

  From allowed-tools in the SKILL.md frontmatter.

• Runs code

  No scripts in the folder and no shell commands in SKILL.md (its code samples are kotlin).

  From the folder's file list and the shell code blocks in SKILL.md.

• Network

  No URLs in SKILL.md.

  From URLs in SKILL.md, links to its own repository left out.

• Credentials

  Names no API keys, tokens, secrets or passwords.

  From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Styles loads about 2.3k tokens when it runs, and up to ~17k if it reads all its reference files. Until then it costs about 105 tokens; SKILL.md has 684 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it

~105

When it runs · the whole SKILL.md, loaded when a task matches

~2.3k

With references · SKILL.md plus every file in references/, read only if the agent opens them

~17k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from arindamxd/camerax-android at commit 7c36352, republished under its Apache-2.0 licence (© arindamxd). 684 words, ~2,266 tokens.

name

styles

description

Use this skill to integrate the Jetpack Compose Styles API into an Android project. This skill guides you through upgrading dependencies, setting up component themes, making custom components styleable, and migrating existing layout properties to use unified styles. Migrate custom design system components, replace hard coded parameters with Style attributes, and use Modifier.styleable for interaction states.

license

Complete terms in LICENSE.txt

metadata.author

Google LLC

metadata.last-updated

2026-08-06

metadata.keywords

Jetpack Compose, Styles, Theming with Styles, Migrate to Styles, Modifier.styleable

kotlin {
    compilerOptions {
        jvmTarget = JvmTarget.fromTarget("17")
        freeCompilerArgs.add("-opt-in=androidx.compose.foundation.style.ExperimentalFoundationStyleApi")
    }
}

<br />

@Composable
fun CustomButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    backgroundColor: Color = JetsnackTheme.colors.brandLight,
    disabledBackgroundColor: Color = JetsnackTheme.colors.brandSecondary,
    shape: Shape = JetsnackTheme.shapes.extraLarge,
    textStyle: TextStyle = JetsnackTheme.typography.labelLarge,
    enabled: Boolean = true,
    content: @Composable RowScope.() -> Unit,
) {
    val interactionSource = remember { MutableInteractionSource() }
    Row(
        modifier
            .clickable(onClick = onClick, indication = null, interactionSource = interactionSource)
            .background(if (enabled) backgroundColor else disabledBackgroundColor, shape)
            .defaultMinSize(58.dp, 40.dp),
        horizontalArrangement = Arrangement.Center,
        verticalAlignment = Alignment.CenterVertically,
        content = content,
    )
}
   

<br />

<br />

// Exposed via ComponentStyles.kt
object ComponentStyles {
    val buttonStyle = Style {
        background(colors.brandLight)
        shape(shapes.extraLarge)
        minWidth(58.dp)
        minHeight(40.dp)
        textStyle(typography.labelLarge)
        disabled {
            background(colors.brandSecondary)
        }
    }
}

@Composable
fun CustomButton(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    style: Style = Style,
    enabled: Boolean = true,
    content: @Composable RowScope.() -> Unit,
) {
    val interactionSource = remember { MutableInteractionSource() }
    val styleState = rememberUpdatedStyleState(interactionSource) {
        it.isEnabled = enabled
    }
    Row(
        modifier
            .clickable(onClick = onClick, indication = null, interactionSource = interactionSource)
            .styleable(styleState, JetsnackTheme.styles.buttonStyle, style),
        horizontalArrangement = Arrangement.Center,
        verticalAlignment = Alignment.CenterVertically,
        content = content,
    )
}
   

<br />

© arindamxd, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 5 other files (references) in .agents/skills/styles of arindamxd/camerax-android.

• SKILL.md
• references/android/develop/ui/compose/designsystems/custom.md
• references/android/develop/ui/compose/styles/fundamentals.md
• references/android/develop/ui/compose/styles/state-animations.md
• references/android/develop/ui/compose/styles/styles-vs-modifiers.md
• references/android/develop/ui/compose/styles/theming.md

Open the folder on GitHubat commit 7c36352

Used in 4 other repositories

We found 6 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 4 other GitHub owners. This page covers the copy in arindamxd/camerax-android, which our catalogue first saw on October 7, 2026.

• rosuH/EasyWatermarkskills/styles.agents/skills/styles+1 more
• jameshnsears/QuoteUnquote.agents/skills/styles
• klxiaoniu/QQVersionList.agents/skills/styles
• android/skillsjetpack-compose/theming/styles