class Typography


Class holding typography definitions as defined by the Wear Material typography specification.

The text styles in this typography are scaled according to the user's preferred font size in the system settings. Larger font sizes can be fixed if necessary in order to avoid pressure on screen space, because they are already sufficiently accessible. Here is an example of fixing the font size for DisplayLarge:

import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp
import androidx.wear.compose.material3.MaterialTheme
import androidx.wear.compose.material3.Text

val typography =
    MaterialTheme.typography.copy(
        displayLarge =
            MaterialTheme.typography.displayLarge.copy(
                fontSize = with(LocalDensity.current) { 40.dp.toSp() }
            )
    )
MaterialTheme(typography = typography) {
    Text(
        text = "Fixed Font",
        maxLines = 1,
        style = MaterialTheme.typography.displayLarge,
        color = MaterialTheme.colorScheme.onBackground,
    )
}

Display styles are utilized for large, short strings of text used to display highly glanceable hero information, significant metrics, confidence or expressive brand moments.

Title styles are hierarchical text used as a mechanism for way-finding, like a page, section title, or sub-section title (in the case of Title Small).

Label styles are used for component level text that describes an action that would happen if interacted with. The most common and widely used application for label is for text nested within a button.

Body styles are reserved for content text like paragraphs of body copy, text used in complex data visualisation, time stamps and metadata.

Numeral text styles are used for numerical digits, usually limited to a few characters. These can take on more expressive properties at the larger display sizes. They give flexibility to expand width axis with minimal localization and font scaling concerns.

Arc text styles are used for curved text making up the signposting on the UI such as time text and curved labels, a tailored font axis that specifically optimizes type along a curve.

Summary

Public constructors

Typography(
    defaultFontFamily: FontFamily,
    arcLarge: TextStyle,
    arcMedium: TextStyle,
    arcSmall: TextStyle,
    displayLarge: TextStyle,
    displayMedium: TextStyle,
    displaySmall: TextStyle,
    titleLarge: TextStyle,
    titleMedium: TextStyle,
    titleSmall: TextStyle,
    labelLarge: TextStyle,
    labelMedium: TextStyle,
    labelSmall: TextStyle,
    bodyLarge: TextStyle,
    bodyMedium: TextStyle,
    bodySmall: TextStyle,
    bodyExtraSmall: TextStyle,
    numeralExtraLarge: TextStyle,
    numeralLarge: TextStyle,
    numeralMedium: TextStyle,
    numeralSmall: TextStyle,
    numeralExtraSmall: TextStyle
)

Public functions

Typography
copy(
    arcLarge: TextStyle,
    arcMedium: TextStyle,
    arcSmall: TextStyle,
    displayLarge: TextStyle,
    displayMedium: TextStyle,
    displaySmall: TextStyle,
    titleLarge: TextStyle,
    titleMedium: TextStyle,
    titleSmall: TextStyle,
    labelLarge: TextStyle,
    labelMedium: TextStyle,
    labelSmall: TextStyle,
    bodyLarge: TextStyle,
    bodyMedium: TextStyle,
    bodySmall: TextStyle,
    bodyExtraSmall: TextStyle,
    numeralExtraLarge: TextStyle,
    numeralLarge: TextStyle,
    numeralMedium: TextStyle,
    numeralSmall: TextStyle,
    numeralExtraSmall: TextStyle
)

Returns a copy of this Typography, optionally overriding some of the values.

open operator Boolean
equals(other: Any?)
open Int
open String

Public properties

TextStyle

ArcLarge is for arc headers and titles.

TextStyle

ArcMedium is for arc headers and titles.

TextStyle

ArcSmall is for arc headers and titles.

TextStyle

BodyExtraSmall is the smallest body.

TextStyle

BodyLarge is the largest body.

TextStyle

BodyMedium is second largest body.

TextStyle

BodySmall is third largest body.

TextStyle

DisplayLarge is the largest headline.

TextStyle

DisplayMedium is the second largest headline.

TextStyle

DisplaySmall is the smallest headline.

TextStyle

LabelLarge is the largest label.

TextStyle

LabelMedium is the medium label.

TextStyle

LabelSmall is the small label.

TextStyle

NumeralExtraLarge is the largest role for digits.

TextStyle

NumeralExtraSmall is the smallest role for digits.

TextStyle

NumeralLarge is the second largest role for digits.

TextStyle

NumeralMedium is the third largest role for digits.

TextStyle

NumeralSmall is the fourth largest role for digits.

TextStyle

TitleLarge is the largest title.

TextStyle

TitleMedium is the medium title.

TextStyle

TitleSmall is the smallest title.

Public constructors

Typography

Added in 1.0.0-alpha29
Typography(
    defaultFontFamily: FontFamily = FontFamily.Default,
    arcLarge: TextStyle = TypographyTokens.ArcLarge,
    arcMedium: TextStyle = TypographyTokens.ArcMedium,
    arcSmall: TextStyle = TypographyTokens.ArcSmall,
    displayLarge: TextStyle = TypographyTokens.DisplayLarge,
    displayMedium: TextStyle = TypographyTokens.DisplayMedium,
    displaySmall: TextStyle = TypographyTokens.DisplaySmall,
    titleLarge: TextStyle = TypographyTokens.TitleLarge,
    titleMedium: TextStyle = TypographyTokens.TitleMedium,
    titleSmall: TextStyle = TypographyTokens.TitleSmall,
    labelLarge: TextStyle = TypographyTokens.LabelLarge,
    labelMedium: TextStyle = TypographyTokens.LabelMedium,
    labelSmall: TextStyle = TypographyTokens.LabelSmall,
    bodyLarge: TextStyle = TypographyTokens.BodyLarge,
    bodyMedium: TextStyle = TypographyTokens.BodyMedium,
    bodySmall: TextStyle = TypographyTokens.BodySmall,
    bodyExtraSmall: TextStyle = TypographyTokens.BodyExtraSmall,
    numeralExtraLarge: TextStyle = TypographyTokens.NumeralExtraLarge,
    numeralLarge: TextStyle = TypographyTokens.NumeralLarge,
    numeralMedium: TextStyle = TypographyTokens.NumeralMedium,
    numeralSmall: TextStyle = TypographyTokens.NumeralSmall,
    numeralExtraSmall: TextStyle = TypographyTokens.NumeralExtraSmall
)

Public functions

copy

Added in 1.0.0-alpha29
fun copy(
    arcLarge: TextStyle = this.arcLarge,
    arcMedium: TextStyle = this.arcMedium,
    arcSmall: TextStyle = this.arcSmall,
    displayLarge: TextStyle = this.displayLarge,
    displayMedium: TextStyle = this.displayMedium,
    displaySmall: TextStyle = this.displaySmall,
    titleLarge: TextStyle = this.titleLarge,
    titleMedium: TextStyle = this.titleMedium,
    titleSmall: TextStyle = this.titleSmall,
    labelLarge: TextStyle = this.labelLarge,
    labelMedium: TextStyle = this.labelMedium,
    labelSmall: TextStyle = this.labelSmall,
    bodyLarge: TextStyle = this.bodyLarge,
    bodyMedium: TextStyle = this.bodyMedium,
    bodySmall: TextStyle = this.bodySmall,
    bodyExtraSmall: TextStyle = this.bodyExtraSmall,
    numeralExtraLarge: TextStyle = this.numeralExtraLarge,
    numeralLarge: TextStyle = this.numeralLarge,
    numeralMedium: TextStyle = this.numeralMedium,
    numeralSmall: TextStyle = this.numeralSmall,
    numeralExtraSmall: TextStyle = this.numeralExtraSmall
): Typography

Returns a copy of this Typography, optionally overriding some of the values.

equals

open operator fun equals(other: Any?): Boolean

hashCode

open fun hashCode(): Int

toString

open fun toString(): String

Public properties

arcLarge

Added in 1.0.0-alpha29
val arcLargeTextStyle

ArcLarge is for arc headers and titles. Arc is for text along a curved path on the screen, reserved for short header text strings at the very top or bottom of the screen like confirmation overlays.

arcMedium

Added in 1.0.0-alpha29
val arcMediumTextStyle

ArcMedium is for arc headers and titles. Arc is for text along a curved path on the screen, reserved for short header text strings at the very top or bottom of the screen like page titles.

arcSmall

Added in 1.0.0-alpha29
val arcSmallTextStyle

ArcSmall is for arc headers and titles. Arc is for text along a curved path on the screen, reserved for short header text strings at the very top or bottom of the screen.

bodyExtraSmall

Added in 1.0.0-alpha29
val bodyExtraSmallTextStyle

BodyExtraSmall is the smallest body. Body texts are typically used for long-form writing as it works well for small text sizes. For longer sections of text, a serif or sans serif typeface is recommended.

bodyLarge

Added in 1.0.0-alpha29
val bodyLargeTextStyle

BodyLarge is the largest body. Body texts are typically used for long-form writing as it works well for small text sizes. For longer sections of text, a serif or sans serif typeface is recommended.

bodyMedium

Added in 1.0.0-alpha29
val bodyMediumTextStyle

BodyMedium is second largest body. Body texts are typically used for long-form writing as it works well for small text sizes. For longer sections of text, a serif or sans serif typeface is recommended.

bodySmall

Added in 1.0.0-alpha29
val bodySmallTextStyle

BodySmall is third largest body. Body texts are typically used for long-form writing as it works well for small text sizes. For longer sections of text, a serif or sans serif typeface is recommended.

displayLarge

Added in 1.0.0-alpha29
val displayLargeTextStyle

DisplayLarge is the largest headline. Displays are the largest text on the screen, reserved for short, important text or numerals.

displayMedium

Added in 1.0.0-alpha29
val displayMediumTextStyle

DisplayMedium is the second largest headline. Displays are the largest text on the screen, reserved for short, important text or numerals.

displaySmall

Added in 1.0.0-alpha29
val displaySmallTextStyle

DisplaySmall is the smallest headline. Displays are the largest text on the screen, reserved for short, important text or numerals.

labelLarge

Added in 1.0.0-alpha29
val labelLargeTextStyle

LabelLarge is the largest label. They are used for displaying prominent texts like label on title buttons.

labelMedium

Added in 1.0.0-alpha29
val labelMediumTextStyle

LabelMedium is the medium label. They are used for displaying texts like primary label on buttons.

labelSmall

Added in 1.0.0-alpha29
val labelSmallTextStyle

LabelSmall is the small label. They are used for displaying texts like secondary label on buttons, labels on compact buttons.

numeralExtraLarge

Added in 1.0.0-alpha29
val numeralExtraLargeTextStyle

NumeralExtraLarge is the largest role for digits. Numerals use tabular spacing by default. They highlight and express glanceable numbers that are limited to a two or three characters only, where no localization is required like the charging screen.

numeralExtraSmall

Added in 1.0.0-alpha29
val numeralExtraSmallTextStyle

NumeralExtraSmall is the smallest role for digits. Numerals use tabular spacing by default. They are for numbers that need to accommodate longer strings of digits, where no localization is required like in-workout metrics.

numeralLarge

Added in 1.0.0-alpha29
val numeralLargeTextStyle

NumeralLarge is the second largest role for digits. Numerals use tabular spacing by default. They are large sized number strings that are limited to big displays of time, where no localization is required like a timer countdown.

numeralMedium

Added in 1.0.0-alpha29
val numeralMediumTextStyle

NumeralMedium is the third largest role for digits. Numerals use tabular spacing by default. They are medium sized numbers that are limited to short strings of digits, where no localization is required like a steps count.

numeralSmall

Added in 1.0.0-alpha29
val numeralSmallTextStyle

NumeralSmall is the fourth largest role for digits. Numerals use tabular spacing by default. They are for numbers that need emphasis at a smaller scale, where no localization is required like date and time pickers.

titleLarge

Added in 1.0.0-alpha29
val titleLargeTextStyle

TitleLarge is the largest title. Titles are smaller than Displays. They are typically reserved for medium-emphasis text that is shorter in length.

titleMedium

Added in 1.0.0-alpha29
val titleMediumTextStyle

TitleMedium is the medium title. Titles are smaller than Displays. They are typically reserved for medium-emphasis text that is shorter in length.

titleSmall

Added in 1.0.0-alpha29
val titleSmallTextStyle

TitleSmall is the smallest title. Titles are smaller than Displays. They are typically reserved for medium-emphasis text that is shorter in length.