Tiny FontAwesome 5 component for Svelte.
- FontAwesome svg icons
- Tree-shakable, only import used icons
- No CSS file required
- FontAwesome duotone icons
npm install svelte-fa
Notice: For Sapper user, you have to install the component as a devDependency.
npm install svelte-fa -D
<script>
import Fa from 'svelte-fa'
import { faFlag } from '@fortawesome/free-solid-svg-icons'
</script>
<Fa icon={faFlag}/>
<Fa
icon={faFlag}
fw
flip="horizontal"
pull="left"
rotate={90}
size="2x"
color="#ff0000"/>
fw
: fixed widthflip
:string
valueshorizontal
,vertical
,both
pull
:string
valuesleft
,right
rotate
:number or string
values90
,180
,270
,30
,-30
...size
:string
valuesxs
,sm
,lg
or2x
,3x
,4x
...color
: icon color, defaultcurrentColor
<script>
import Fa from 'svelte-fa'
import { faFlag } from '@fortawesome/pro-duotone-svg-icons'
</script>
<Fa
icon={faFlag}
primaryColor="red"
secondaryColor="#000000"
primaryOpacity={0.8}
secondaryOpacity={0.6}
swapOpacity/>
<script>
import Fa from 'svelte-fa'
import { faFlag } from '@fortawesome/pro-duotone-svg-icons'
const theme = {
primaryColor: 'red',
secondaryColor: '#000000',
primaryOpacity: 0.8,
secondaryOpacity: 0.6,
}
</script>
<Fa
icon={faFlag}
{...theme}/>