Svelte Heroicons
@bobthered/svelte-heroicons
Svelte component for creating Heroicon components with tailwindcss
Installation
npm i -D @bobthered/svelte-heroicons
Basic Usage
<script>
import { Check } from '@bobthered/svelte-heroicons/small'
import { Menu } from '@bobthered/svelte-heroicons/medium'
</script>
<Check class="h-5 w-5"/>
<Menu class="h-6 w-6"/>
Available Props
| Prop | Default | Description |
|---|---|---|
| class | "" |
Add classes here for styling |
| strokeWidth | 2 |
Set the stroke width for medium icons |
Available Icons
- AcademicCap
- Adjustments
- Annotation
- Archive
- ArrowCircleDown
- ArrowCircleLeft
- ArrowCircleRight
- ArrowCircleUp
- ArrowDown
- ArrowLeft
- ArrowNarrowDown
- ArrowNarrowLeft
- ArrowNarrowRight
- ArrowNarrowUp
- ArrowRight
- ArrowsExpand
- ArrowUp
- AtSymbol
- Backspace
- BadgeCheck
- Ban
- Beaker
- Bell
- Bookmark
- BookmarkAlt
- BookOpen
- Briefcase
- Cake
- Calculator
- Calendar
- Camera
- Cash
- ChartBar
- ChartPie
- ChartSquareBar
- Chat
- ChatAlt
- ChatAlt2
- Check
- CheckCircle
- ChevronDoubleDown
- ChevronDoubleLeft
- ChevronDoubleRight
- ChevronDoubleUp
- ChevronDown
- ChevronLeft
- ChevronRight
- ChevronUp
- Chip
- Clipboard
- ClipboardCheck
- ClipboardCopy
- ClipboardList
- Clock
- Cloud
- CloudDownload
- CloudUpload
- Code
- Cog
- Collection
- ColorSwatch
- CreditCard
- Cube
- CubeTransparent
- CurrencyBangladeshi
- CurrencyDollar
- CurrencyEuro
- CurrencyPound
- CurrencyRupee
- CurrencyYen
- CursorClick
- Database
- DesktopComputer
- DeviceMobile
- DeviceTablet
- Document
- DocumentAdd
- DocumentDownload
- DocumentDuplicate
- DocumentRemove
- DocumentReport
- DocumentSearch
- DocumentText
- DotsCircleHorizontal
- DotsHorizontal
- DotsVertical
- Download
- Duplicate
- EmojiHappy
- EmojiSad
- Exclamation
- ExclamationCircle
- ExternalLink
- Eye
- EyeOff
- FastForward
- Film
- Filter
- FingerPrint
- Fire
- Flag
- Folder
- FolderAdd
- FolderDownload
- FolderOpen
- FolderRemove
- Gift
- Globe
- GlobeAlt
- Hand
- Hashtag
- Heart
- Home
- Identification
- Inbox
- InboxIn
- InformationCircle
- Key
- Library
- LightBulb
- LightningBolt
- Link
- LocationMarker
- LockClosed
- LockOpen
- Login
- Logout
- MailOpen
- Map
- Menu
- MenuAlt1
- MenuAlt2
- MenuAlt3
- MenuAlt4
- Microphone
- Minus
- MinusCircle
- MinusSm
- Moon
- MusicNote
- Newspaper
- OfficeBuilding
- PaperAirplane
- PaperClip
- Pause
- Pencil
- PencilAlt
- Phone
- PhoneIncoming
- PhoneMissedCall
- PhoneOutgoing
- Photograph
- Play
- Plus
- PlusCircle
- PlusSm
- PresentationChartBar
- PresentationChartLine
- Printer
- Puzzle
- Qrcode
- QuestionMarkCircle
- ReceiptRefund
- ReceiptTax
- Refresh
- Reply
- Rewind
- Rss
- Save
- SaveAs
- Scale
- Scissors
- Search
- SearchCircle
- Selector
- Server
- Share
- ShieldCheck
- ShieldExclamation
- ShoppingBag
- ShoppingCart
- SortAscending
- SortDescending
- Sparkles
- Speakerphone
- Star
- StatusOffline
- StatusOnline
- Stop
- Sun
- Support
- SwitchHorizontal
- SwitchVertical
- Table
- Tag
- Template
- Terminal
- ThumbDown
- ThumbUp
- Ticket
- Translate
- Trash
- TrendingDown
- TrendingUp
- Truck
- Upload
- User
- UserAdd
- UserCircle
- UserGroup
- UserRemove
- Users
- Variable
- VideoCamera
- ViewBoards
- ViewGrid
- ViewGridAdd
- ViewList
- VolumeOff
- VolumeUp
- Wifi
- X
- XCircle
- ZoomIn
- ZoomOut
Top categories
Need a Svelte website built?
Hire a professional Svelte developer today.