Text - Frameworks

Pre-defined styles provide a font and size.

AndroidreleasediOSreleased

iOS

AndroidiOS

Syntax

Warp.Text(
    _ text: String,
    style: Warp.TextStyle,
    color: Color = Warp.Color.token.text
)

Warp.Text("This is a text", style: .body)

Visual options

There are a variety of variants supported for the Text component:

enum Warp.TextStyle {
    case display
    case title1
    case title2
    case title3
    case title4
    case title5
    case title6
    case preamble
    case body
    case bodyStrong
    case caption
    case captionStrong
    case detail
    case detailStrong
}

Legacy support

By default all Warp components return a SwiftUI View but there is always a UIKit UIView available to use also.

Warp.Text("This is a text", style: .body).uiView

Parameters

Required props

Name	Type	Default	Description
text	String		The text to be displayed
style	Warp.TextStyle		Sets the appearance of the text - font and size. Use one of the predefined TextStyle values: .display, .title1, .title2, .title3, .title4, .title5, .title6, .preamble, .body, .bodyStrong, .caption, .captionStrong, .detail, or .detailStrong

Optional Props

Name	Type	Default	Description
color	Color	Warp.Token.text	A solid color for the text.

Questions?

Feel free to ask any questions on usage in the Warp DS Slack channel: #warp-design-system