Stay organized with collections
Save and categorize content based on your preferences.
You can style parts of text to improve readability, increase positive user
experience, and encourage greater creativity through use of colors and fonts.
Version compatibility
This implementation requires that your project minSDK be set to API level 21 or
higher.
Dependencies
Style parts of text
The following code displays the string "Hello World" using blue for the "H", red
for the "W", and black for the rest of the text. To set different styles within
a single Text composable, use the following code:
Content and code samples on this page are subject to the licenses described in the Content License. Java and OpenJDK are trademarks or registered trademarks of Oracle and/or its affiliates.
Last updated 2025-08-26 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-08-26 UTC."],[],[],null,["# Style parts of text\n\n\u003cbr /\u003e\n\nYou can style parts of text to improve readability, increase positive user\nexperience, and encourage greater creativity through use of colors and fonts.\n\nVersion compatibility\n---------------------\n\nThis implementation requires that your project minSDK be set to API level 21 or\nhigher.\n\n### Dependencies\n\n### Kotlin\n\n\u003cbr /\u003e\n\n```kotlin\n implementation(platform(\"androidx.compose:compose-bom:2025.08.00\"))\n \n```\n\n\u003cbr /\u003e\n\n### Groovy\n\n\u003cbr /\u003e\n\n```groovy\n implementation platform('androidx.compose:compose-bom:2025.08.00')\n \n```\n\n\u003cbr /\u003e\n\nStyle parts of text\n-------------------\n\nThe following code displays the string \"Hello World\" using blue for the \"H\", red\nfor the \"W\", and black for the rest of the text. To set different styles within\na single [`Text`](/reference/kotlin/androidx/compose/material/package-summary#Text(androidx.compose.ui.text.AnnotatedString,androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.font.FontStyle,androidx.compose.ui.text.font.FontWeight,androidx.compose.ui.text.font.FontFamily,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextDecoration,androidx.compose.ui.text.style.TextAlign,androidx.compose.ui.unit.TextUnit,androidx.compose.ui.text.style.TextOverflow,kotlin.Boolean,kotlin.Int,kotlin.Int,kotlin.collections.Map,kotlin.Function1,androidx.compose.ui.text.TextStyle)) composable, use the following code:\n\n\n```kotlin\n@Composable\nfun MultipleStylesInText() {\n Text(\n buildAnnotatedString {\n withStyle(style = SpanStyle(color = Color.Blue)) {\n append(\"H\")\n }\n append(\"ello \")\n\n withStyle(style = SpanStyle(fontWeight = FontWeight.Bold, color = Color.Red)) {\n append(\"W\")\n }\n append(\"orld\")\n }\n )\n}https://github.com/android/snippets/blob/dd30aee903e8c247786c064faab1a9ca8d10b46e/compose/snippets/src/main/java/com/example/compose/snippets/text/TextSnippets.kt#L233-L248\n```\n\n\u003cbr /\u003e\n\n### Key points about the code\n\n- Uses [`buildAnnotatedString`](/reference/kotlin/androidx/compose/ui/text/package-summary#buildAnnotatedString(kotlin.Function1)) that returns an [`AnnotatedString`](/reference/kotlin/androidx/compose/ui/text/AnnotatedString) string to set different styles within text.\n- Styles part of text with [`SpanStyle`](/reference/kotlin/androidx/compose/ui/text/SpanStyle), a configuration that allows character-level styling.\n\nResults\n-------\n\n**Figure 1.** A line of text with multiple styles.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Display text\n\nText is a central piece of any UI. Find out different ways you can present text in your app to provide a delightful user experience. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-text) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]