# Code

> Inline code rendering — either the `code` variant for code-tagged spans, or the `[mono]` modifier to force monospace on any other variant.

Source: https://ngwr.dev/guides/typography/code  
Kind: Directive

## Inline code

Wrap inline tokens in `<code wrTypography variant="code">`.

```angular-html
<p wrTypography>
  Inject the theme service with <code wrTypography variant="code">inject(WrTheme)</code>.
</p>
```

## Force monospace

`[mono]` flips any variant to the monospace stack — useful when the surrounding element is a `<p>` or a `<span>` rather than a `<code>`.

```angular-html
<p wrTypography [mono]="true">
  Forces monospace on any variant — useful for ids, paths, version tags.
</p>
```

## Tones in code

Combine `variant="code"` with any tone for status callouts.

```angular-html
<code wrTypography variant="code" tone="primary">routes.start.installation</code>
<code wrTypography variant="code" tone="success">200 OK</code>
<code wrTypography variant="code" tone="danger">500 Server Error</code>
```

## See also

- [[wrTypography]](https://ngwr.dev/reference/directives/typography) — Every input, the full variant union, and the classes the directive emits.