<script>
 import { SunLightIcon } from '@indaco/svelte-iconoir';
 // use THIS approach for production
 import ListIcon from '@indaco/svelte-iconoir/icons/ListIcon.svelte';
</script>

<ListIcon />

<SunLightIcon class="roundedColor" />

<style>
 .roundedColor {
  padding: 4px;
  background-color: yellow;
  border-style: solid;
  border-color: #d1d5db;
 }
</style>

<script>
 import View360Icon from '@indaco/svelte-iconoir/icons/View360Icon.svelte';
</script>

<View360Icon
 style="background-color: green; padding: 4px; border-radius: 9999px;"
 color="#ffffff" />

<script>
 import ActivityIcon from '@indaco/svelte-iconoir/icons/ActivityIcon.svelte';
</script>

<ActivityIcon class="p-1 rounded-full border-2 bg-green-400" size="2.5em" />