Typography
-
Cmn
class Typography
The Material Design type scale includes a range of contrasting styles that support the needs of your product and its content.
The type scale is a combination of thirteen styles that are supported by the type system. It contains reusable categories of text, each with an intended application and meaning.

Summary
Public constructors |
|
|---|---|
Typography(Constructor to create a |
Cmn
|
Public functions |
||
|---|---|---|
Typography |
copy(Returns a copy of this Typography, optionally overriding some of the values. |
Cmn
|
open operator Boolean |
Cmn
|
|
open Int |
hashCode() |
Cmn
|
open String |
toString() |
Cmn
|
Public properties |
||
|---|---|---|
TextStyle |
body1 is the largest body, and is typically used for long-form writing as it works well for small text sizes. |
Cmn
|
TextStyle |
body2 is the smallest body, and is typically used for long-form writing as it works well for small text sizes. |
Cmn
|
TextStyle |
button text is a call to action used in different types of buttons (such as text, outlined and contained buttons) and in tabs, dialogs, and cards. |
Cmn
|
TextStyle |
caption is one of the smallest font sizes. |
Cmn
|
TextStyle |
h1 is the largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
h2 is the second largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
h3 is the third largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
h4 is the fourth largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
h5 is the fifth largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
h6 is the sixth largest headline, reserved for short, important text or numerals. |
Cmn
|
TextStyle |
overline is one of the smallest font sizes. |
Cmn
|
TextStyle |
subtitle1 is the largest subtitle, and is typically reserved for medium-emphasis text that is shorter in length. |
Cmn
|
TextStyle |
subtitle2 is the smallest subtitle, and is typically reserved for medium-emphasis text that is shorter in length. |
Cmn
|
Public constructors
Typography
Typography(
defaultFontFamily: FontFamily = FontFamily.Default,
h1: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Light, fontSize = 96.sp, lineHeight = 112.sp, letterSpacing = (-1.5).sp, ),
h2: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Light, fontSize = 60.sp, lineHeight = 72.sp, letterSpacing = (-0.5).sp, ),
h3: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 48.sp, lineHeight = 56.sp, letterSpacing = 0.sp, ),
h4: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 34.sp, lineHeight = 36.sp, letterSpacing = 0.25.sp, ),
h5: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 24.sp, lineHeight = 24.sp, letterSpacing = 0.sp, ),
h6: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Medium, fontSize = 20.sp, lineHeight = 24.sp, letterSpacing = 0.15.sp, ),
subtitle1: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 16.sp, lineHeight = 24.sp, letterSpacing = 0.15.sp, ),
subtitle2: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Medium, fontSize = 14.sp, lineHeight = 24.sp, letterSpacing = 0.1.sp, ),
body1: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 16.sp, lineHeight = 24.sp, letterSpacing = 0.5.sp, ),
body2: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 14.sp, lineHeight = 20.sp, letterSpacing = 0.25.sp, ),
button: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Medium, fontSize = 14.sp, lineHeight = 16.sp, letterSpacing = 1.25.sp, ),
caption: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 12.sp, lineHeight = 16.sp, letterSpacing = 0.4.sp, ),
overline: TextStyle = DefaultTextStyle.copy( fontWeight = FontWeight.Normal, fontSize = 10.sp, lineHeight = 16.sp, letterSpacing = 1.5.sp, )
)
Constructor to create a Typography. For information on the types of style defined in this constructor, see the property documentation for Typography.
| Parameters | |
|---|---|
defaultFontFamily: FontFamily = FontFamily.Default |
the default |
h1: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Light,
fontSize = 96.sp,
lineHeight = 112.sp,
letterSpacing = (-1.5).sp,
) |
h1 is the largest headline, reserved for short, important text or numerals. |
h2: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Light,
fontSize = 60.sp,
lineHeight = 72.sp,
letterSpacing = (-0.5).sp,
) |
h2 is the second largest headline, reserved for short, important text or numerals. |
h3: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 48.sp,
lineHeight = 56.sp,
letterSpacing = 0.sp,
) |
h3 is the third largest headline, reserved for short, important text or numerals. |
h4: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 34.sp,
lineHeight = 36.sp,
letterSpacing = 0.25.sp,
) |
h4 is the fourth largest headline, reserved for short, important text or numerals. |
h5: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 24.sp,
lineHeight = 24.sp,
letterSpacing = 0.sp,
) |
h5 is the fifth largest headline, reserved for short, important text or numerals. |
h6: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Medium,
fontSize = 20.sp,
lineHeight = 24.sp,
letterSpacing = 0.15.sp,
) |
h6 is the sixth largest headline, reserved for short, important text or numerals. |
subtitle1: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 16.sp,
lineHeight = 24.sp,
letterSpacing = 0.15.sp,
) |
subtitle1 is the largest subtitle, and is typically reserved for medium-emphasis text that is shorter in length. |
subtitle2: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Medium,
fontSize = 14.sp,
lineHeight = 24.sp,
letterSpacing = 0.1.sp,
) |
subtitle2 is the smallest subtitle, and is typically reserved for medium-emphasis text that is shorter in length. |
body1: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 16.sp,
lineHeight = 24.sp,
letterSpacing = 0.5.sp,
) |
body1 is the largest body, and is typically used for long-form writing as it works well for small text sizes. |
body2: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 14.sp,
lineHeight = 20.sp,
letterSpacing = 0.25.sp,
) |
body2 is the smallest body, and is typically used for long-form writing as it works well for small text sizes. |
button: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Medium,
fontSize = 14.sp,
lineHeight = 16.sp,
letterSpacing = 1.25.sp,
) |
button text is a call to action used in different types of buttons (such as text, outlined and contained buttons) and in tabs, dialogs, and cards. |
caption: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 12.sp,
lineHeight = 16.sp,
letterSpacing = 0.4.sp,
) |
caption is one of the smallest font sizes. It is used sparingly to annotate imagery or to introduce a headline. |
overline: TextStyle = DefaultTextStyle.copy(
fontWeight = FontWeight.Normal,
fontSize = 10.sp,
lineHeight = 16.sp,
letterSpacing = 1.5.sp,
) |
overline is one of the smallest font sizes. It is used sparingly to annotate imagery or to introduce a headline. |
Public functions
copy
fun copy(
h1: TextStyle = this.h1,
h2: TextStyle = this.h2,
h3: TextStyle = this.h3,
h4: TextStyle = this.h4,
h5: TextStyle = this.h5,
h6: TextStyle = this.h6,
subtitle1: TextStyle = this.subtitle1,
subtitle2: TextStyle = this.subtitle2,
body1: TextStyle = this.body1,
body2: TextStyle = this.body2,
button: TextStyle = this.button,
caption: TextStyle = this.caption,
overline: TextStyle = this.overline
): Typography
Returns a copy of this Typography, optionally overriding some of the values.
Public properties
body1
val body1: TextStyle
body1 is the largest body, and is 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.
body2
val body2: TextStyle
body2 is the smallest body, and is 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.
button
val button: TextStyle
button text is a call to action used in different types of buttons (such as text, outlined and contained buttons) and in tabs, dialogs, and cards. Button text is typically sans serif, using all caps text.
caption
val caption: TextStyle
caption is one of the smallest font sizes. It is used sparingly to annotate imagery or to introduce a headline.
h1
val h1: TextStyle
h1 is the largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
h2
val h2: TextStyle
h2 is the second largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
h3
val h3: TextStyle
h3 is the third largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
h4
val h4: TextStyle
h4 is the fourth largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
h5
val h5: TextStyle
h5 is the fifth largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
h6
val h6: TextStyle
h6 is the sixth largest headline, reserved for short, important text or numerals. For headlines, you can choose an expressive font, such as a display, handwritten, or script style. These unconventional font designs have details and intricacy that help attract the eye.
overline
val overline: TextStyle
overline is one of the smallest font sizes. It is used sparingly to annotate imagery or to introduce a headline.