The design system is a collection of UI elements
Usage
import { Mark } from "chakra-ui-solid";<Text>
The <Mark>design system</Mark> is a collection of UI elements
</Text>Examples
Variants
Use the variant prop to change the color of the mark.
The design system is a collection of UI elements
The design system is a collection of UI elements
The design system is a collection of UI elements
The design system is a collection of UI elements
Props
| Prop | Default | Type |
|---|---|---|
variant | — | ConditionalValue<'subtle' | 'solid' | 'text' | 'plain' | PresetVariant<'mark', 'variant'>>How the run is highlighted — `subtle` and `solid` fill it from `colorPalette`, `text` only thickens the weight, and `plain` adds nothing to the base. |
Plus HTMLChakraProps<"mark"> — the whole style-prop surface and the DOM attributes of the element it renders, several hundred names listed as their sources rather than expanded — and the three every component takes: as, render and unstyled.
Mark has no default variant, which is why the bare <Mark> above looks like the text around it:
the recipe neutralises the browser’s own yellow highlight, and every colour comes from
colorPalette instead.