stdf/packages/create/snippet/svg-symbol.txt

<div class="my-6 flex justify-between px-8">
	<Icon name="cake" theme path="symbols/Heroicons.svg" />
	<Icon name="riding-line" path="symbols/Remix.svg" />
	<Icon name="spy-line" theme path="symbols/Remix.svg" />
	<Icon name="javascript-fill" injClass="text-[red] dark:text-green" path="symbols/Remix.svg" />
	<Icon name="cup" theme path="symbols/IconPark.svg" />
</div>
<div class="px-4 text-xs">
	{#if lang === 'zh_CN'}
		<p>
			以上图标通过 <a class="underline" href="https://www.npmjs.com/package/@any-tdf/vite-plugin-svg-symbol" target="_blank">
				@any-tdf/vite-plugin-svg-symbol
			</a> 使用 SVG Symbol 方式：
		</p>
		<p class="mt-2">
			第一个来自
			<a class="underline" href="https://heroicons.com" target="_blank">Heroicons</a> ，最后一个来自
			<a class="underline" href="https://iconpark.oceanengine.com" target="_blank">IconPark</a> ，其余来自
			<a class="underline" href="https://remixicon.com" target="_blank">Remix Icon</a> 。
		</p>
	{:else}
		<p>
			The above icons use <a class="underline" href="https://www.npmjs.com/package/@any-tdf/vite-plugin-svg-symbol" target="_blank">
				@any-tdf/vite-plugin-svg-symbol
			</a> for SVG symbols:
		</p>
		<p class="mt-2">
			The first one comes from
			<a class="underline" href="https://heroicons.com" target="_blank">Heroicons</a>, the last one comes from
			<a class="underline" href="https://iconpark.oceanengine.com" target="_blank">IconPark</a>, the rest come from
			<a class="underline" href="https://remixicon.com" target="_blank">Remix Icon</a>.
		</p>
	{/if}
</div>