| $print-transparent-backgrounds | This variable is used to define that all elements will have transparent backgrounds when printed, to save on ink. | Boolean | true |
| $print-hrefs | This variable is used to define the displays next to all links “href” when printed. | Boolean | true |
| $header-font-family | This variable is used to define the font family for header elements. | String or List | $body-font-family
|
| $header-font-weight | This variable is used to define the font-weight of headers. | String | $global-weight-normal
|
| $header-font-style | This variable is used to define the font style (e.g. italicized) of headers. | String | normal |
| $font-family-monospace | This variable is used to define the Font stack used for elements that use monospaced type, such as code samples. | String or List | Consolas, ‘Liberation Mono’, Courier, monospace
|
| $header-color | This variable is used to define the color of headers. | Color | inherit |
| $header-lineheight | This variable is used to define the line height of headers. | Number | 1.4
|
| $header-margin-bottom | This variable is used to define the bottom margin of headers. | Number | 0.5rem
|
| $header-styles | This variable is used to define the styles for headings at various screen sizes. | Map |
small: ( ‘h1’: (‘font-size’: 24)
‘h2’: (‘font-size’: 20)
‘h3’: (‘font-size’: 19)
‘h4’: (‘font-size’: 18)
‘h5’: (‘font-size’: 17)
‘h6’: (‘font-size’: 16)
)
medium: ( ‘h1’: (‘font-size’: 48)
‘h2’: (‘font-size’: 40)
‘h3’: (‘font-size’: 31)
‘h4’: (‘font-size’: 25)
‘h5’: (‘font-size’: 20)
‘h6’: (‘font-size’: 16)
)
|
| $header-text-rendering | This variable is used to define the text rendering method of headers. | String | optimizeLegibility |
| $small-font-size | This variable is used to define the font size of <small> elements. | Number | 80%
|
| $header-small-font-color | This variable is used to define the color of <small> elements when placed inside headers. | Color | $medium-gray
|
| $paragraph-lineheight | This variable is used to define the line height of text inside <p> elements. | Number | 1.6
|
| $paragraph-margin-bottom | This variable is used to define the bottom margin of paragraphs. | Number | 1rem |
| $paragraph-text-rendering | This variable is used to define the text rendering method for paragraph text. | String | optimizeLegibility |
| $enable-code-inline | This variable is used to define the use the .code-inline component as default for <code> elements. | Boolean | true |
| $anchor-color | This variable is used to define the default color for links. | Color | $primary-color
|
| $anchor-color-hover | This variable is used to define the default color for links on hover. | Color | scale-color($anchor-color, $lightness: -14%)
|
| $anchor-text-decoration | This variable is used to define the default text decoration for links. | String | none |
| $anchor-text-decoration-hover | This variable is used to define the default text decoration for links on hover. | String | none |
| $hr-width | This variable is used to define the Maximum width of a divider. | Number | $global-width |
| $hr-border | This variable is used to define the default border for a divider. | List | 1px solid $medium-gray
|
| $hr-margin | This variable is used to define the default margin for a divider. | Number or List | rem-calc(20) auto
|
| $list-lineheight | This variable is used to define the line height for items in a list. | Number | $paragraph-lineheight
|
| $list-margin-bottom | This variable is used to define the bottom margin for items in a list. | Number | $paragraph-margin-bottom
|
| $list-style-type | This variable is used to define the bullet type to use for unordered lists (e.g., square, circle, disc). | String | disc
|
| $list-style-position | This variable is used to define the positioning for bullets on unordered list items. | String | outside
|
| $list-side-margin | This variable is used to define the left (or right) margin for lists. | Number | 1.25rem
|
| $list-nested-side-margin | This variable is used to define the left (or right) margin for a list inside a list. | Number | 1.25rem
|
| $defnlist-margin-bottom | This variable is used to define the bottom margin for <dl> elements. | Number | 1rem |
| $defnlist-term-weight | This variable is used to define the font weight for <dt> elements. | String | $global-weight-bold
|
| $defnlist-term-margin-bottom | This variable is used to define the Spacing between <dt> and <dd> elements. | Number | 0.3rem
|
| $blockquote-color | This variable is used to define the text color of <blockquote> elements. | Color | $dark-gray
|
| $blockquote-padding | This variable is used to define the padding inside a <blockquote> element. | Number or List | rem-calc(9 20 0 19)
|
| $blockquote-border | This variable is used to define the side border for <blockquote> elements. | List | 1px solid $medium-gray
|
| $enable-cite-block | This variable is used to define the use of .cite-block component as default for <cite> elements. | Boolean | true
|
| $keystroke-font | This variable is used to define the font family for <kbd> elements. | String or List | $font-family-monospace
|
| $keystroke-color | This variable is used to define the text color for <kbd> elements. | Color | $black
|
| $keystroke-background | This variable is used to define the background color for <kbd> elements. | Color | $light-gray
|
| $keystroke-padding | This variable is used to define the padding for <kbd> elements. | Number or List | rem-calc(2 4 0)
|
| $keystroke-radius | This variable is used to define the border radius for <kbd> elements. | Number or List | $global-radius
|
| $abbr-underline | This variable is used to define the bottom border style for <abbr> elements. | List | 1px dotted $black
|