Svg #
import Svg from '@ryanatkn/fuz/Svg.svelte';
<Svg data={fuz_logo} />
Fills available space by default:
With custom size #
Set size
: (see the Moss typography docs)
<Svg data={fuz_logo} size="var(--icon_size_xl)" />
<Svg data={fuz_logo} size="var(--icon_size_sm)" />
Set --size
on the component or a parent:
<span style:--size="var(--icon_size_xl)"><Svg data={fuz_logo} /></span>
With custom color #
Set fill
: (see the Moss colors docs)
<Svg data={fuz_logo} fill="var(--color_d_5)" />
<Svg data={fuz_logo} fill="var(--color_b_5)" />
Set --text_color
on the component or a parent, for svgs that have no default fill:
<span style:--text_color="var(--color_i_5)"><Svg data={github_logo} /></span>