---
title: colors from brand palette
format:
  typst:
    keep-typ: true
    include-in-header:
      text: |
        #set text(fallback: false, weight: 100)
  dashboard: default
  html: default
  revealjs: default
---

We're setting `color` and `background-color` on `brand.typography.monospace-inline` and `.monospace-block` to named colors in the `brand.color.palette`.

Raw inlines `3 * fib(5)` are displayed in green on yellow.

Raw blocks are displayed in pink grey on dark green.

:::{.sourceCode}
```
const fib = num => num < 2 ? num : fib(num-1) + fib(num - 2);
console.log(fib(12))
```
:::

Syntax highlighting complicates things.

```javascript
const fib = num => num < 2 ? num : fib(num-1) + fib(num - 2);
console.log(fib(12))
```
