CSS Variables

CSS Variable Default Value
--corner-radius-s 4px
--corner-radius-m 8px
--corner-radius-l 12px
scss/canvas/token/_corner-radius.scss

Corner Radius Preview

S (4px)
M (8px)
L (12px)
scss/canvas/token/_corner-radius.scss

Usage

Corner radius tokens are currently used in:

  • Blockquote: --corner-radius-m (8px)
  • Inline code: --corner-radius-m (8px)
  • Code block: --corner-radius-m (8px)

Note: --corner-radius-s and --corner-radius-l are defined but not yet used in the theme.

scss/canvas/token/_corner-radius.scss

Customization Example

Override --corner-radius-m to 24px:

---
style: |
  :root {
    --corner-radius-m: 24px;
  }
---

This blockquote now has rounded corners with 24px radius.

scss/canvas/token/_corner-radius.scss