> ## Documentation Index
> Fetch the complete documentation index at: https://rive.app/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Font

A font that shapes and draws text. Fonts come from the file's assets with
`context:font(name)`, from a view model `Property<Font>`, or from bytes with
`Font.decode`. Metrics are for a 1 point font and grow negative upwards,
so multiply by the size and expect `ascent` below zero.

```lua highlight={6} theme={null}
type Label = {
  text: Text,
}

function init(self: Label, context: Context): boolean
  local font = context:font('Inter')
  if font then
    self.text:append('Hello', { font = font, size = 24, paint = Paint.new() })
  end
  return true
end
```

## Fields

### `ascent`

Distance from the baseline to the top of the em box for a 1 point font, negative.

### `descent`

Distance from the baseline to the bottom of the em box for a 1 point font.

### `capHeight`

Distance from the baseline to the top of capital letters, negative.

### `xHeight`

Distance from the baseline to the top of lowercase letters, negative.

### `weight`

Weight from 1 to 1000, 400 being regular.

### `isItalic`

### `axes`

Variable axes the font offers.

### `features`

Four letter OpenType feature tags the font offers, such as 'liga'.

## Static Functions

### `decode`

<div class="signature">
  ```lua theme={null}
  decode(bytes: buffer) -> Font?
  ```
</div>

Decodes a TrueType or OpenType font from bytes a script obtained
itself, such as a downloaded file. Font files in a project are font
assets, reached with `context:font`, not blobs. Returns nil when the
bytes are not a font.

```lua theme={null}
local font = Font.decode(downloadedBytes)
```

## Methods

### `lineHeight`

<div class="signature">
  ```lua theme={null}
  lineHeight(size: number) -> number
  ```
</div>

Height of one line of text at the given size.

### `hasGlyph`

<div class="signature">
  ```lua theme={null}
  hasGlyph(codepoint: number) -> boolean
  ```
</div>

Whether the font has a glyph for the unicode codepoint.

### `axisValue`

<div class="signature">
  ```lua theme={null}
  axisValue(tag: string) -> number
  ```
</div>

Current value of a variable axis, by tag.

### `withOptions`

<div class="signature">
  ```lua theme={null}
  withOptions(axes: {[string]: number}?, features: {[string]: number}?) -> Font
  ```
</div>

A new font at the given axis values and feature settings.

```lua theme={null}
local bold = font:withOptions({ wght = 700 }, { liga = 0 })
```

### `glyphPath`

<div class="signature">
  ```lua theme={null}
  glyphPath(glyphId: number) -> Path
  ```
</div>

Outline of one glyph in 1 point units with the baseline at y 0, wound
for a clockwise fill. Scale by the font size to draw it.
