Skip to main content
Create new
Introduction
Reactivity
Props
Logic
Events
Bindings
Lifecycle
Stores
Motion
Transitions
Animations
Easing
SVG
Actions
Classes
Component composition
Context API
Special elements
Module context
Debugging
7GUIs
Miscellaneous
App.svelte
<script>
import * as Icon from 'svelte-remix';
const random_hex_color_code = () => {
let n = (Math.random() * 0xfffff * 1000000).toString(16);
return '#' + n.slice(0, 6);
};
</script>

<Icon.AncientGateFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.AncientGateLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.AncientPavilionFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.AncientPavilionLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.BankFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.BankLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building2FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building2LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building3FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building3LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building4FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Building4LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.BuildingFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.BuildingLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.CommunityFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.CommunityLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.GovernmentFillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.GovernmentLineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home2FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home2LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home3FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home3LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home4FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home4LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home5FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home5LineBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home6FillBUILDINGS size="40" color="{random_hex_color_code()}" />
<Icon.Home6LineBUILDINGS size="40" color="{random_hex_color_code()}" />
loading Svelte compiler...
/* Select a component to see its compiled code */
result = svelte.compile(source, {
generate: ,
});
/* Select a component to see its compiled code */