12345678910111213141516171819202122<script lang="ts"> interface Props { color: string; size: number; }
let { color, size }: Props = $props();</script>
<svg class="shrink-0 rounded-sm" style="background: color-mix(in srgb, {color} 27%, transparent); color: {color}; width: calc(var(--spacing) * {size}); height: calc(var(--spacing) * {size});" xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 16 16" ><path fill="currentColor" d="M8 8a3 3 0 1 0 0-6a3 3 0 0 0 0 6m4.735 6c.618 0 1.093-.561.872-1.139a6.002 6.002 0 0 0-11.215 0c-.22.578.254 1.139.872 1.139z" /></svg>