Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: document addIcons usage #887

Open
liamdebeasi opened this issue Sep 28, 2020 · 4 comments
Open

docs: document addIcons usage #887

liamdebeasi opened this issue Sep 28, 2020 · 4 comments

Comments

@liamdebeasi
Copy link
Contributor

Some users have expressed an interest in using functionality provided by addIcons, so it would be good to document its usage.

Use Case: ionic-team/ionic-framework#22181 A developer wants to dynamically show an icon based upon results from a server. They could do (result) ? heart : heartOutline, but they do not want to have to continually import each icon. In this case, it would be helpful for them to add the icon globally via addIcons.

@Polarisation
Copy link

I found the current usage docs very confusing:

If you're using Ionic Framework, Ionicons is packaged by default, so no installation is necessary.

Then the usage example shows:

<ion-icon name="heart"></ion-icon>

But this doesn't work with Ionic. I had to first use addIcons otherwise the icon does not show up unless it's one of the icons used by internal components.

I finally figured out I could use addIcons to make it work as in the usage example. Not quite sure how I'd do it without addIcons in Ionic Vue.js - perhaps an example can be added for that too.

@Ryubal
Copy link

Ryubal commented Mar 18, 2022

Any news?

@CrookedGrin
Copy link

I was able to get these to work as standalone imports with this:

import { initialize } from "@ionic/core/components";
import { defineCustomElement as Icon } from "@ionic/core/components/ion-icon.js";
import { addIcons } from "ionicons";
import { iconList } from "./ionicons_imports";
initialize();
addIcons(iconList);

and in ionicons_imports:

import {
  accessibility, accessibilityOutline, accessibilitySharp, add, addCircle, addCircleOutline, addCircleSharp, addOutline, addSharp, airplane, airplaneOutline, airplaneSharp, alarm, alarmOutline, alarmSharp, albums, albumsOutline, albumsSharp, alert, alertCircle, alertCircleOutline, alertCircleSharp, alertOutline, alertSharp, americanFootball, americanFootballOutline, americanFootballSharp, analytics, analyticsOutline, analyticsSharp, aperture, apertureOutline, apertureSharp, apps, appsOutline, appsSharp, archive, archiveOutline, archiveSharp, arrowBack, arrowBackCircle, arrowBackCircleOutline, arrowBackCircleSharp, arrowBackOutline, arrowBackSharp, arrowDown, arrowDownCircle, arrowDownCircleOutline, arrowDownCircleSharp, arrowDownOutline, arrowDownSharp, arrowForward, arrowForwardCircle, arrowForwardCircleOutline, arrowForwardCircleSharp, arrowForwardOutline, arrowForwardSharp, arrowRedo, arrowRedoCircle, arrowRedoCircleOutline, arrowRedoCircleSharp, arrowRedoOutline, arrowRedoSharp, arrowUndo, arrowUndoCircle, arrowUndoCircleOutline, arrowUndoCircleSharp, arrowUndoOutline, arrowUndoSharp, arrowUp, arrowUpCircle, arrowUpCircleOutline, arrowUpCircleSharp, arrowUpOutline, arrowUpSharp, at, atCircle, atCircleOutline, atCircleSharp, atOutline, atSharp, attach, attachOutline, attachSharp, backspace, backspaceOutline, backspaceSharp, bag, bagAdd, bagAddOutline, bagAddSharp, bagCheck, bagCheckOutline, bagCheckSharp, bagHandle, bagHandleOutline, bagHandleSharp, bagOutline, bagRemove, bagRemoveOutline, bagRemoveSharp, bagSharp, balloon, balloonOutline, balloonSharp, ban, banOutline, banSharp, bandage, bandageOutline, bandageSharp, barChart, barChartOutline, barChartSharp, barbell, barbellOutline, barbellSharp, barcode, barcodeOutline, barcodeSharp, baseball, baseballOutline, baseballSharp, basket, basketOutline, basketSharp, basketball, basketballOutline, basketballSharp, batteryCharging, batteryChargingOutline, batteryChargingSharp, batteryDead, batteryDeadOutline, batteryDeadSharp, batteryFull, batteryFullOutline, batteryFullSharp, batteryHalf, batteryHalfOutline, batteryHalfSharp, beaker, beakerOutline, beakerSharp, bed, bedOutline, bedSharp, beer, beerOutline, beerSharp, bicycle, bicycleOutline, bicycleSharp, bluetooth, bluetoothOutline, bluetoothSharp, boat, boatOutline, boatSharp, body, bodyOutline, bodySharp, bonfire, bonfireOutline, bonfireSharp, book, bookOutline, bookSharp, bookmark, bookmarkOutline, bookmarkSharp, bookmarks, bookmarksOutline, bookmarksSharp, bowlingBall, bowlingBallOutline, bowlingBallSharp, briefcase, briefcaseOutline, briefcaseSharp, browsers, browsersOutline, browsersSharp, brush, brushOutline, brushSharp, bug, bugOutline, bugSharp, build, buildOutline, buildSharp, bulb, bulbOutline, bulbSharp, bus, busOutline, busSharp, business, businessOutline, businessSharp, cafe, cafeOutline, cafeSharp, calculator, calculatorOutline, calculatorSharp, calendar, calendarClear, calendarClearOutline, calendarClearSharp, calendarNumber, calendarNumberOutline, calendarNumberSharp, calendarOutline, calendarSharp, call, callOutline, callSharp, camera, cameraOutline, cameraReverse, cameraReverseOutline, cameraReverseSharp, cameraSharp, car, carOutline, carSharp, carSport, carSportOutline, carSportSharp, card, cardOutline, cardSharp, caretBack, caretBackCircle, caretBackCircleOutline, caretBackCircleSharp, caretBackOutline, caretBackSharp, caretDown, caretDownCircle, caretDownCircleOutline, caretDownCircleSharp, caretDownOutline, caretDownSharp, caretForward, caretForwardCircle, caretForwardCircleOutline, caretForwardCircleSharp, caretForwardOutline, caretForwardSharp, caretUp, caretUpCircle, caretUpCircleOutline, caretUpCircleSharp, caretUpOutline, caretUpSharp, cart, cartOutline, cartSharp, cash, cashOutline, cashSharp, cellular, cellularOutline, cellularSharp, chatbox, chatboxEllipses, chatboxEllipsesOutline, chatboxEllipsesSharp, chatboxOutline, chatboxSharp, chatbubble, chatbubbleEllipses, chatbubbleEllipsesOutline, chatbubbleEllipsesSharp, chatbubbleOutline, chatbubbleSharp, chatbubbles, chatbubblesOutline, chatbubblesSharp, checkbox, checkboxOutline, checkboxSharp, checkmark, checkmarkCircle, checkmarkCircleOutline, checkmarkCircleSharp, checkmarkDone, checkmarkDoneCircle, checkmarkDoneCircleOutline, checkmarkDoneCircleSharp, checkmarkDoneOutline, checkmarkDoneSharp, checkmarkOutline, checkmarkSharp, chevronBack, chevronBackCircle, chevronBackCircleOutline, chevronBackCircleSharp, chevronBackOutline, chevronBackSharp, chevronDown, chevronDownCircle, chevronDownCircleOutline, chevronDownCircleSharp, chevronDownOutline, chevronDownSharp, chevronForward, chevronForwardCircle, chevronForwardCircleOutline, chevronForwardCircleSharp, chevronForwardOutline, chevronForwardSharp, chevronUp, chevronUpCircle, chevronUpCircleOutline, chevronUpCircleSharp, chevronUpOutline, chevronUpSharp, clipboard, clipboardOutline, clipboardSharp, close, closeCircle, closeCircleOutline, closeCircleSharp, closeOutline, closeSharp, cloud, cloudCircle, cloudCircleOutline, cloudCircleSharp, cloudDone, cloudDoneOutline, cloudDoneSharp, cloudDownload, cloudDownloadOutline, cloudDownloadSharp, cloudOffline, cloudOfflineOutline, cloudOfflineSharp, cloudOutline, cloudSharp, cloudUpload, cloudUploadOutline, cloudUploadSharp, cloudy, cloudyNight, cloudyNightOutline, cloudyNightSharp, cloudyOutline, cloudySharp, code, codeDownload, codeDownloadOutline, codeDownloadSharp, codeOutline, codeSharp, codeSlash, codeSlashOutline, codeSlashSharp, codeWorking, codeWorkingOutline, codeWorkingSharp, cog, cogOutline, cogSharp, colorFill, colorFillOutline, colorFillSharp, colorFilter, colorFilterOutline, colorFilterSharp, colorPalette, colorPaletteOutline, colorPaletteSharp, colorWand, colorWandOutline, colorWandSharp, compass, compassOutline, compassSharp, construct, constructOutline, constructSharp, contract, contractOutline, contractSharp, contrast, contrastOutline, contrastSharp, copy, copyOutline, copySharp, create, createOutline, createSharp, crop, cropOutline, cropSharp, cube, cubeOutline, cubeSharp, cut, cutOutline, cutSharp, desktop, desktopOutline, desktopSharp, diamond, diamondOutline, diamondSharp, dice, diceOutline, diceSharp, disc, discOutline, discSharp, document, documentAttach, documentAttachOutline, documentAttachSharp, documentLock, documentLockOutline, documentLockSharp, documentOutline, documentSharp, documentText, documentTextOutline, documentTextSharp, documents, documentsOutline, documentsSharp, download, downloadOutline, downloadSharp, duplicate, duplicateOutline, duplicateSharp, ear, earOutline, earSharp, earth, earthOutline, earthSharp, easel, easelOutline, easelSharp, egg, eggOutline, eggSharp, ellipse, ellipseOutline, ellipseSharp, ellipsisHorizontal, ellipsisHorizontalCircle, ellipsisHorizontalCircleOutline, ellipsisHorizontalCircleSharp, ellipsisHorizontalOutline, ellipsisHorizontalSharp, ellipsisVertical, ellipsisVerticalCircle, ellipsisVerticalCircleOutline, ellipsisVerticalCircleSharp, ellipsisVerticalOutline, ellipsisVerticalSharp, enter, enterOutline, enterSharp, exit, exitOutline, exitSharp, expand, expandOutline, expandSharp, extensionPuzzle, extensionPuzzleOutline, extensionPuzzleSharp, eye, eyeOff, eyeOffOutline, eyeOffSharp, eyeOutline, eyeSharp, eyedrop, eyedropOutline, eyedropSharp, fastFood, fastFoodOutline, fastFoodSharp, female, femaleOutline, femaleSharp, fileTray, fileTrayFull, fileTrayFullOutline, fileTrayFullSharp, fileTrayOutline, fileTraySharp, fileTrayStacked, fileTrayStackedOutline, fileTrayStackedSharp, film, filmOutline, filmSharp, filter, filterCircle, filterCircleOutline, filterCircleSharp, filterOutline, filterSharp, fingerPrint, fingerPrintOutline, fingerPrintSharp, fish, fishOutline, fishSharp, fitness, fitnessOutline, fitnessSharp, flag, flagOutline, flagSharp, flame, flameOutline, flameSharp, flash, flashOff, flashOffOutline, flashOffSharp, flashOutline, flashSharp, flashlight, flashlightOutline, flashlightSharp, flask, flaskOutline, flaskSharp, flower, flowerOutline, flowerSharp, folder, folderOpen, folderOpenOutline, folderOpenSharp, folderOutline, folderSharp, football, footballOutline, footballSharp, footsteps, footstepsOutline, footstepsSharp, funnel, funnelOutline, funnelSharp, gameController, gameControllerOutline, gameControllerSharp, gift, giftOutline, giftSharp, gitBranch, gitBranchOutline, gitBranchSharp, gitCommit, gitCommitOutline, gitCommitSharp, gitCompare, gitCompareOutline, gitCompareSharp, gitMerge, gitMergeOutline, gitMergeSharp, gitNetwork, gitNetworkOutline, gitNetworkSharp, gitPullRequest, gitPullRequestOutline, gitPullRequestSharp, glasses, glassesOutline, glassesSharp, globe, globeOutline, globeSharp, golf, golfOutline, golfSharp, grid, gridOutline, gridSharp, hammer, hammerOutline, hammerSharp, handLeft, handLeftOutline, handLeftSharp, handRight, handRightOutline, handRightSharp, happy, happyOutline, happySharp, hardwareChip, hardwareChipOutline, hardwareChipSharp, headset, headsetOutline, headsetSharp, heart, heartCircle, heartCircleOutline, heartCircleSharp, heartDislike, heartDislikeCircle, heartDislikeCircleOutline, heartDislikeCircleSharp, heartDislikeOutline, heartDislikeSharp, heartHalf, heartHalfOutline, heartHalfSharp, heartOutline, heartSharp, help, helpBuoy, helpBuoyOutline, helpBuoySharp, helpCircle, helpCircleOutline, helpCircleSharp, helpOutline, helpSharp, home, homeOutline, homeSharp, hourglass, hourglassOutline, hourglassSharp, iceCream, iceCreamOutline, iceCreamSharp, idCard, idCardOutline, idCardSharp, image, imageOutline, imageSharp, images, imagesOutline, imagesSharp, infinite, infiniteOutline, infiniteSharp, information, informationCircle, informationCircleOutline, informationCircleSharp, informationOutline, informationSharp, invertMode, invertModeOutline, invertModeSharp, journal, journalOutline, journalSharp, key, keyOutline, keySharp, keypad, keypadOutline, keypadSharp, language, languageOutline, languageSharp, laptop, laptopOutline, laptopSharp, layers, layersOutline, layersSharp, leaf, leafOutline, leafSharp, library, libraryOutline, librarySharp, link, linkOutline, linkSharp, list, listCircle, listCircleOutline, listCircleSharp, listOutline, listSharp, locate, locateOutline, locateSharp, location, locationOutline, locationSharp, lockClosed, lockClosedOutline, lockClosedSharp, lockOpen, lockOpenOutline, lockOpenSharp, logIn, logInOutline, logInSharp, logOut, logOutOutline, logOutSharp, logoAlipay, logoAmazon, logoAmplify, logoAndroid, logoAngular, logoApple, logoAppleAppstore, logoAppleAr, logoBehance, logoBitbucket, logoBitcoin, logoBuffer, logoCapacitor, logoChrome, logoClosedCaptioning, logoCodepen, logoCss3, logoDesignernews, logoDeviantart, logoDiscord, logoDocker, logoDribbble, logoDropbox, logoEdge, logoElectron, logoEuro, logoFacebook, logoFigma, logoFirebase, logoFirefox, logoFlickr, logoFoursquare, logoGithub, logoGitlab, logoGoogle, logoGooglePlaystore, logoHackernews, logoHtml5, logoInstagram, logoIonic, logoIonitron, logoJavascript, logoLaravel, logoLinkedin, logoMarkdown, logoMastodon, logoMedium, logoMicrosoft, logoNoSmoking, logoNodejs, logoNpm, logoOctocat, logoPaypal, logoPinterest, logoPlaystation, logoPwa, logoPython, logoReact, logoReddit, logoRss, logoSass, logoSkype, logoSlack, logoSnapchat, logoSoundcloud, logoStackoverflow, logoSteam, logoStencil, logoTableau, logoTiktok, logoTumblr, logoTux, logoTwitch, logoTwitter, logoUsd, logoVenmo, logoVercel, logoVimeo, logoVk, logoVue, logoWebComponent, logoWechat, logoWhatsapp, logoWindows, logoWordpress, logoXbox, logoXing, logoYahoo, logoYen, logoYoutube, magnet, magnetOutline, magnetSharp, mail, mailOpen, mailOpenOutline, mailOpenSharp, mailOutline, mailSharp, mailUnread, mailUnreadOutline, mailUnreadSharp, male, maleFemale, maleFemaleOutline, maleFemaleSharp, maleOutline, maleSharp, man, manOutline, manSharp, map, mapOutline, mapSharp, medal, medalOutline, medalSharp, medical, medicalOutline, medicalSharp, medkit, medkitOutline, medkitSharp, megaphone, megaphoneOutline, megaphoneSharp, menu, menuOutline, menuSharp, mic, micCircle, micCircleOutline, micCircleSharp, micOff, micOffCircle, micOffCircleOutline, micOffCircleSharp, micOffOutline, micOffSharp, micOutline, micSharp, moon, moonOutline, moonSharp, move, moveOutline, moveSharp, musicalNote, musicalNoteOutline, musicalNoteSharp, musicalNotes, musicalNotesOutline, musicalNotesSharp, navigate, navigateCircle, navigateCircleOutline, navigateCircleSharp, navigateOutline, navigateSharp, newspaper, newspaperOutline, newspaperSharp, notifications, notificationsCircle, notificationsCircleOutline, notificationsCircleSharp, notificationsOff, notificationsOffCircle, notificationsOffCircleOutline, notificationsOffCircleSharp, notificationsOffOutline, notificationsOffSharp, notificationsOutline, notificationsSharp, nuclear, nuclearOutline, nuclearSharp, nutrition, nutritionOutline, nutritionSharp, open, openOutline, openSharp, options, optionsOutline, optionsSharp, paperPlane, paperPlaneOutline, paperPlaneSharp, partlySunny, partlySunnyOutline, partlySunnySharp, pause, pauseCircle, pauseCircleOutline, pauseCircleSharp, pauseOutline, pauseSharp, paw, pawOutline, pawSharp, pencil, pencilOutline, pencilSharp, people, peopleCircle, peopleCircleOutline, peopleCircleSharp, peopleOutline, peopleSharp, person, personAdd, personAddOutline, personAddSharp, personCircle, personCircleOutline, personCircleSharp, personOutline, personRemove, personRemoveOutline, personRemoveSharp, personSharp, phoneLandscape, phoneLandscapeOutline, phoneLandscapeSharp, phonePortrait, phonePortraitOutline, phonePortraitSharp, pieChart, pieChartOutline, pieChartSharp, pin, pinOutline, pinSharp, pint, pintOutline, pintSharp, pizza, pizzaOutline, pizzaSharp, planet, planetOutline, planetSharp, play, playBack, playBackCircle, playBackCircleOutline, playBackCircleSharp, playBackOutline, playBackSharp, playCircle, playCircleOutline, playCircleSharp, playForward, playForwardCircle, playForwardCircleOutline, playForwardCircleSharp, playForwardOutline, playForwardSharp, playOutline, playSharp, playSkipBack, playSkipBackCircle, playSkipBackCircleOutline, playSkipBackCircleSharp, playSkipBackOutline, playSkipBackSharp, playSkipForward, playSkipForwardCircle, playSkipForwardCircleOutline, playSkipForwardCircleSharp, playSkipForwardOutline, playSkipForwardSharp, podium, podiumOutline, podiumSharp, power, powerOutline, powerSharp, pricetag, pricetagOutline, pricetagSharp, pricetags, pricetagsOutline, pricetagsSharp, print, printOutline, printSharp, prism, prismOutline, prismSharp, pulse, pulseOutline, pulseSharp, push, pushOutline, pushSharp, qrCode, qrCodeOutline, qrCodeSharp, radio, radioButtonOff, radioButtonOffOutline, radioButtonOffSharp, radioButtonOn, radioButtonOnOutline, radioButtonOnSharp, radioOutline, radioSharp, rainy, rainyOutline, rainySharp, reader, readerOutline, readerSharp, receipt, receiptOutline, receiptSharp, recording, recordingOutline, recordingSharp, refresh, refreshCircle, refreshCircleOutline, refreshCircleSharp, refreshOutline, refreshSharp, reload, reloadCircle, reloadCircleOutline, reloadCircleSharp, reloadOutline, reloadSharp, remove, removeCircle, removeCircleOutline, removeCircleSharp, removeOutline, removeSharp, reorderFour, reorderFourOutline, reorderFourSharp, reorderThree, reorderThreeOutline, reorderThreeSharp, reorderTwo, reorderTwoOutline, reorderTwoSharp, repeat, repeatOutline, repeatSharp, resize, resizeOutline, resizeSharp, restaurant, restaurantOutline, restaurantSharp, returnDownBack, returnDownBackOutline, returnDownBackSharp, returnDownForward, returnDownForwardOutline, returnDownForwardSharp, returnUpBack, returnUpBackOutline, returnUpBackSharp, returnUpForward, returnUpForwardOutline, returnUpForwardSharp, ribbon, ribbonOutline, ribbonSharp, rocket, rocketOutline, rocketSharp, rose, roseOutline, roseSharp, sad, sadOutline, sadSharp, save, saveOutline, saveSharp, scale, scaleOutline, scaleSharp, scan, scanCircle, scanCircleOutline, scanCircleSharp, scanOutline, scanSharp, school, schoolOutline, schoolSharp, search, searchCircle, searchCircleOutline, searchCircleSharp, searchOutline, searchSharp, send, sendOutline, sendSharp, server, serverOutline, serverSharp, settings, settingsOutline, settingsSharp, shapes, shapesOutline, shapesSharp, share, shareOutline, shareSharp, shareSocial, shareSocialOutline, shareSocialSharp, shield, shieldCheckmark, shieldCheckmarkOutline, shieldCheckmarkSharp, shieldHalf, shieldHalfOutline, shieldHalfSharp, shieldOutline, shieldSharp, shirt, shirtOutline, shirtSharp, shuffle, shuffleOutline, shuffleSharp, skull, skullOutline, skullSharp, snow, snowOutline, snowSharp, sparkles, sparklesOutline, sparklesSharp, speedometer, speedometerOutline, speedometerSharp, square, squareOutline, squareSharp, star, starHalf, starHalfOutline, starHalfSharp, starOutline, starSharp, statsChart, statsChartOutline, statsChartSharp, stop, stopCircle, stopCircleOutline, stopCircleSharp, stopOutline, stopSharp, stopwatch, stopwatchOutline, stopwatchSharp, storefront, storefrontOutline, storefrontSharp, subway, subwayOutline, subwaySharp, sunny, sunnyOutline, sunnySharp, swapHorizontal, swapHorizontalOutline, swapHorizontalSharp, swapVertical, swapVerticalOutline, swapVerticalSharp, sync, syncCircle, syncCircleOutline, syncCircleSharp, syncOutline, syncSharp, tabletLandscape, tabletLandscapeOutline, tabletLandscapeSharp, tabletPortrait, tabletPortraitOutline, tabletPortraitSharp, telescope, telescopeOutline, telescopeSharp, tennisball, tennisballOutline, tennisballSharp, terminal, terminalOutline, terminalSharp, text, textOutline, textSharp, thermometer, thermometerOutline, thermometerSharp, thumbsDown, thumbsDownOutline, thumbsDownSharp, thumbsUp, thumbsUpOutline, thumbsUpSharp, thunderstorm, thunderstormOutline, thunderstormSharp, ticket, ticketOutline, ticketSharp, time, timeOutline, timeSharp, timer, timerOutline, timerSharp, today, todayOutline, todaySharp, toggle, toggleOutline, toggleSharp, trailSign, trailSignOutline, trailSignSharp, train, trainOutline, trainSharp, transgender, transgenderOutline, transgenderSharp, trash, trashBin, trashBinOutline, trashBinSharp, trashOutline, trashSharp, trendingDown, trendingDownOutline, trendingDownSharp, trendingUp, trendingUpOutline, trendingUpSharp, triangle, triangleOutline, triangleSharp, trophy, trophyOutline, trophySharp, tv, tvOutline, tvSharp, umbrella, umbrellaOutline, umbrellaSharp, unlink, unlinkOutline, unlinkSharp, videocam, videocamOff, videocamOffOutline, videocamOffSharp, videocamOutline, videocamSharp, volumeHigh, volumeHighOutline, volumeHighSharp, volumeLow, volumeLowOutline, volumeLowSharp, volumeMedium, volumeMediumOutline, volumeMediumSharp, volumeMute, volumeMuteOutline, volumeMuteSharp, volumeOff, volumeOffOutline, volumeOffSharp, walk, walkOutline, walkSharp, wallet, walletOutline, walletSharp, warning, warningOutline, warningSharp, watch, watchOutline, watchSharp, water, waterOutline, waterSharp, wifi, wifiOutline, wifiSharp, wine, wineOutline, wineSharp, woman, womanOutline, womanSharp
} from "ionicons/icons";

export const iconList = {
  accessibility, accessibilityOutline, accessibilitySharp, add, addCircle, addCircleOutline, addCircleSharp, addOutline, addSharp, airplane, airplaneOutline, airplaneSharp, alarm, alarmOutline, alarmSharp, albums, albumsOutline, albumsSharp, alert, alertCircle, alertCircleOutline, alertCircleSharp, alertOutline, alertSharp, americanFootball, americanFootballOutline, americanFootballSharp, analytics, analyticsOutline, analyticsSharp, aperture, apertureOutline, apertureSharp, apps, appsOutline, appsSharp, archive, archiveOutline, archiveSharp, arrowBack, arrowBackCircle, arrowBackCircleOutline, arrowBackCircleSharp, arrowBackOutline, arrowBackSharp, arrowDown, arrowDownCircle, arrowDownCircleOutline, arrowDownCircleSharp, arrowDownOutline, arrowDownSharp, arrowForward, arrowForwardCircle, arrowForwardCircleOutline, arrowForwardCircleSharp, arrowForwardOutline, arrowForwardSharp, arrowRedo, arrowRedoCircle, arrowRedoCircleOutline, arrowRedoCircleSharp, arrowRedoOutline, arrowRedoSharp, arrowUndo, arrowUndoCircle, arrowUndoCircleOutline, arrowUndoCircleSharp, arrowUndoOutline, arrowUndoSharp, arrowUp, arrowUpCircle, arrowUpCircleOutline, arrowUpCircleSharp, arrowUpOutline, arrowUpSharp, at, atCircle, atCircleOutline, atCircleSharp, atOutline, atSharp, attach, attachOutline, attachSharp, backspace, backspaceOutline, backspaceSharp, bag, bagAdd, bagAddOutline, bagAddSharp, bagCheck, bagCheckOutline, bagCheckSharp, bagHandle, bagHandleOutline, bagHandleSharp, bagOutline, bagRemove, bagRemoveOutline, bagRemoveSharp, bagSharp, balloon, balloonOutline, balloonSharp, ban, banOutline, banSharp, bandage, bandageOutline, bandageSharp, barChart, barChartOutline, barChartSharp, barbell, barbellOutline, barbellSharp, barcode, barcodeOutline, barcodeSharp, baseball, baseballOutline, baseballSharp, basket, basketOutline, basketSharp, basketball, basketballOutline, basketballSharp, batteryCharging, batteryChargingOutline, batteryChargingSharp, batteryDead, batteryDeadOutline, batteryDeadSharp, batteryFull, batteryFullOutline, batteryFullSharp, batteryHalf, batteryHalfOutline, batteryHalfSharp, beaker, beakerOutline, beakerSharp, bed, bedOutline, bedSharp, beer, beerOutline, beerSharp, bicycle, bicycleOutline, bicycleSharp, bluetooth, bluetoothOutline, bluetoothSharp, boat, boatOutline, boatSharp, body, bodyOutline, bodySharp, bonfire, bonfireOutline, bonfireSharp, book, bookOutline, bookSharp, bookmark, bookmarkOutline, bookmarkSharp, bookmarks, bookmarksOutline, bookmarksSharp, bowlingBall, bowlingBallOutline, bowlingBallSharp, briefcase, briefcaseOutline, briefcaseSharp, browsers, browsersOutline, browsersSharp, brush, brushOutline, brushSharp, bug, bugOutline, bugSharp, build, buildOutline, buildSharp, bulb, bulbOutline, bulbSharp, bus, busOutline, busSharp, business, businessOutline, businessSharp, cafe, cafeOutline, cafeSharp, calculator, calculatorOutline, calculatorSharp, calendar, calendarClear, calendarClearOutline, calendarClearSharp, calendarNumber, calendarNumberOutline, calendarNumberSharp, calendarOutline, calendarSharp, call, callOutline, callSharp, camera, cameraOutline, cameraReverse, cameraReverseOutline, cameraReverseSharp, cameraSharp, car, carOutline, carSharp, carSport, carSportOutline, carSportSharp, card, cardOutline, cardSharp, caretBack, caretBackCircle, caretBackCircleOutline, caretBackCircleSharp, caretBackOutline, caretBackSharp, caretDown, caretDownCircle, caretDownCircleOutline, caretDownCircleSharp, caretDownOutline, caretDownSharp, caretForward, caretForwardCircle, caretForwardCircleOutline, caretForwardCircleSharp, caretForwardOutline, caretForwardSharp, caretUp, caretUpCircle, caretUpCircleOutline, caretUpCircleSharp, caretUpOutline, caretUpSharp, cart, cartOutline, cartSharp, cash, cashOutline, cashSharp, cellular, cellularOutline, cellularSharp, chatbox, chatboxEllipses, chatboxEllipsesOutline, chatboxEllipsesSharp, chatboxOutline, chatboxSharp, chatbubble, chatbubbleEllipses, chatbubbleEllipsesOutline, chatbubbleEllipsesSharp, chatbubbleOutline, chatbubbleSharp, chatbubbles, chatbubblesOutline, chatbubblesSharp, checkbox, checkboxOutline, checkboxSharp, checkmark, checkmarkCircle, checkmarkCircleOutline, checkmarkCircleSharp, checkmarkDone, checkmarkDoneCircle, checkmarkDoneCircleOutline, checkmarkDoneCircleSharp, checkmarkDoneOutline, checkmarkDoneSharp, checkmarkOutline, checkmarkSharp, chevronBack, chevronBackCircle, chevronBackCircleOutline, chevronBackCircleSharp, chevronBackOutline, chevronBackSharp, chevronDown, chevronDownCircle, chevronDownCircleOutline, chevronDownCircleSharp, chevronDownOutline, chevronDownSharp, chevronForward, chevronForwardCircle, chevronForwardCircleOutline, chevronForwardCircleSharp, chevronForwardOutline, chevronForwardSharp, chevronUp, chevronUpCircle, chevronUpCircleOutline, chevronUpCircleSharp, chevronUpOutline, chevronUpSharp, clipboard, clipboardOutline, clipboardSharp, close, closeCircle, closeCircleOutline, closeCircleSharp, closeOutline, closeSharp, cloud, cloudCircle, cloudCircleOutline, cloudCircleSharp, cloudDone, cloudDoneOutline, cloudDoneSharp, cloudDownload, cloudDownloadOutline, cloudDownloadSharp, cloudOffline, cloudOfflineOutline, cloudOfflineSharp, cloudOutline, cloudSharp, cloudUpload, cloudUploadOutline, cloudUploadSharp, cloudy, cloudyNight, cloudyNightOutline, cloudyNightSharp, cloudyOutline, cloudySharp, code, codeDownload, codeDownloadOutline, codeDownloadSharp, codeOutline, codeSharp, codeSlash, codeSlashOutline, codeSlashSharp, codeWorking, codeWorkingOutline, codeWorkingSharp, cog, cogOutline, cogSharp, colorFill, colorFillOutline, colorFillSharp, colorFilter, colorFilterOutline, colorFilterSharp, colorPalette, colorPaletteOutline, colorPaletteSharp, colorWand, colorWandOutline, colorWandSharp, compass, compassOutline, compassSharp, construct, constructOutline, constructSharp, contract, contractOutline, contractSharp, contrast, contrastOutline, contrastSharp, copy, copyOutline, copySharp, create, createOutline, createSharp, crop, cropOutline, cropSharp, cube, cubeOutline, cubeSharp, cut, cutOutline, cutSharp, desktop, desktopOutline, desktopSharp, diamond, diamondOutline, diamondSharp, dice, diceOutline, diceSharp, disc, discOutline, discSharp, document, documentAttach, documentAttachOutline, documentAttachSharp, documentLock, documentLockOutline, documentLockSharp, documentOutline, documentSharp, documentText, documentTextOutline, documentTextSharp, documents, documentsOutline, documentsSharp, download, downloadOutline, downloadSharp, duplicate, duplicateOutline, duplicateSharp, ear, earOutline, earSharp, earth, earthOutline, earthSharp, easel, easelOutline, easelSharp, egg, eggOutline, eggSharp, ellipse, ellipseOutline, ellipseSharp, ellipsisHorizontal, ellipsisHorizontalCircle, ellipsisHorizontalCircleOutline, ellipsisHorizontalCircleSharp, ellipsisHorizontalOutline, ellipsisHorizontalSharp, ellipsisVertical, ellipsisVerticalCircle, ellipsisVerticalCircleOutline, ellipsisVerticalCircleSharp, ellipsisVerticalOutline, ellipsisVerticalSharp, enter, enterOutline, enterSharp, exit, exitOutline, exitSharp, expand, expandOutline, expandSharp, extensionPuzzle, extensionPuzzleOutline, extensionPuzzleSharp, eye, eyeOff, eyeOffOutline, eyeOffSharp, eyeOutline, eyeSharp, eyedrop, eyedropOutline, eyedropSharp, fastFood, fastFoodOutline, fastFoodSharp, female, femaleOutline, femaleSharp, fileTray, fileTrayFull, fileTrayFullOutline, fileTrayFullSharp, fileTrayOutline, fileTraySharp, fileTrayStacked, fileTrayStackedOutline, fileTrayStackedSharp, film, filmOutline, filmSharp, filter, filterCircle, filterCircleOutline, filterCircleSharp, filterOutline, filterSharp, fingerPrint, fingerPrintOutline, fingerPrintSharp, fish, fishOutline, fishSharp, fitness, fitnessOutline, fitnessSharp, flag, flagOutline, flagSharp, flame, flameOutline, flameSharp, flash, flashOff, flashOffOutline, flashOffSharp, flashOutline, flashSharp, flashlight, flashlightOutline, flashlightSharp, flask, flaskOutline, flaskSharp, flower, flowerOutline, flowerSharp, folder, folderOpen, folderOpenOutline, folderOpenSharp, folderOutline, folderSharp, football, footballOutline, footballSharp, footsteps, footstepsOutline, footstepsSharp, funnel, funnelOutline, funnelSharp, gameController, gameControllerOutline, gameControllerSharp, gift, giftOutline, giftSharp, gitBranch, gitBranchOutline, gitBranchSharp, gitCommit, gitCommitOutline, gitCommitSharp, gitCompare, gitCompareOutline, gitCompareSharp, gitMerge, gitMergeOutline, gitMergeSharp, gitNetwork, gitNetworkOutline, gitNetworkSharp, gitPullRequest, gitPullRequestOutline, gitPullRequestSharp, glasses, glassesOutline, glassesSharp, globe, globeOutline, globeSharp, golf, golfOutline, golfSharp, grid, gridOutline, gridSharp, hammer, hammerOutline, hammerSharp, handLeft, handLeftOutline, handLeftSharp, handRight, handRightOutline, handRightSharp, happy, happyOutline, happySharp, hardwareChip, hardwareChipOutline, hardwareChipSharp, headset, headsetOutline, headsetSharp, heart, heartCircle, heartCircleOutline, heartCircleSharp, heartDislike, heartDislikeCircle, heartDislikeCircleOutline, heartDislikeCircleSharp, heartDislikeOutline, heartDislikeSharp, heartHalf, heartHalfOutline, heartHalfSharp, heartOutline, heartSharp, help, helpBuoy, helpBuoyOutline, helpBuoySharp, helpCircle, helpCircleOutline, helpCircleSharp, helpOutline, helpSharp, home, homeOutline, homeSharp, hourglass, hourglassOutline, hourglassSharp, iceCream, iceCreamOutline, iceCreamSharp, idCard, idCardOutline, idCardSharp, image, imageOutline, imageSharp, images, imagesOutline, imagesSharp, infinite, infiniteOutline, infiniteSharp, information, informationCircle, informationCircleOutline, informationCircleSharp, informationOutline, informationSharp, invertMode, invertModeOutline, invertModeSharp, journal, journalOutline, journalSharp, key, keyOutline, keySharp, keypad, keypadOutline, keypadSharp, language, languageOutline, languageSharp, laptop, laptopOutline, laptopSharp, layers, layersOutline, layersSharp, leaf, leafOutline, leafSharp, library, libraryOutline, librarySharp, link, linkOutline, linkSharp, list, listCircle, listCircleOutline, listCircleSharp, listOutline, listSharp, locate, locateOutline, locateSharp, location, locationOutline, locationSharp, lockClosed, lockClosedOutline, lockClosedSharp, lockOpen, lockOpenOutline, lockOpenSharp, logIn, logInOutline, logInSharp, logOut, logOutOutline, logOutSharp, logoAlipay, logoAmazon, logoAmplify, logoAndroid, logoAngular, logoApple, logoAppleAppstore, logoAppleAr, logoBehance, logoBitbucket, logoBitcoin, logoBuffer, logoCapacitor, logoChrome, logoClosedCaptioning, logoCodepen, logoCss3, logoDesignernews, logoDeviantart, logoDiscord, logoDocker, logoDribbble, logoDropbox, logoEdge, logoElectron, logoEuro, logoFacebook, logoFigma, logoFirebase, logoFirefox, logoFlickr, logoFoursquare, logoGithub, logoGitlab, logoGoogle, logoGooglePlaystore, logoHackernews, logoHtml5, logoInstagram, logoIonic, logoIonitron, logoJavascript, logoLaravel, logoLinkedin, logoMarkdown, logoMastodon, logoMedium, logoMicrosoft, logoNoSmoking, logoNodejs, logoNpm, logoOctocat, logoPaypal, logoPinterest, logoPlaystation, logoPwa, logoPython, logoReact, logoReddit, logoRss, logoSass, logoSkype, logoSlack, logoSnapchat, logoSoundcloud, logoStackoverflow, logoSteam, logoStencil, logoTableau, logoTiktok, logoTumblr, logoTux, logoTwitch, logoTwitter, logoUsd, logoVenmo, logoVercel, logoVimeo, logoVk, logoVue, logoWebComponent, logoWechat, logoWhatsapp, logoWindows, logoWordpress, logoXbox, logoXing, logoYahoo, logoYen, logoYoutube, magnet, magnetOutline, magnetSharp, mail, mailOpen, mailOpenOutline, mailOpenSharp, mailOutline, mailSharp, mailUnread, mailUnreadOutline, mailUnreadSharp, male, maleFemale, maleFemaleOutline, maleFemaleSharp, maleOutline, maleSharp, man, manOutline, manSharp, map, mapOutline, mapSharp, medal, medalOutline, medalSharp, medical, medicalOutline, medicalSharp, medkit, medkitOutline, medkitSharp, megaphone, megaphoneOutline, megaphoneSharp, menu, menuOutline, menuSharp, mic, micCircle, micCircleOutline, micCircleSharp, micOff, micOffCircle, micOffCircleOutline, micOffCircleSharp, micOffOutline, micOffSharp, micOutline, micSharp, moon, moonOutline, moonSharp, move, moveOutline, moveSharp, musicalNote, musicalNoteOutline, musicalNoteSharp, musicalNotes, musicalNotesOutline, musicalNotesSharp, navigate, navigateCircle, navigateCircleOutline, navigateCircleSharp, navigateOutline, navigateSharp, newspaper, newspaperOutline, newspaperSharp, notifications, notificationsCircle, notificationsCircleOutline, notificationsCircleSharp, notificationsOff, notificationsOffCircle, notificationsOffCircleOutline, notificationsOffCircleSharp, notificationsOffOutline, notificationsOffSharp, notificationsOutline, notificationsSharp, nuclear, nuclearOutline, nuclearSharp, nutrition, nutritionOutline, nutritionSharp, open, openOutline, openSharp, options, optionsOutline, optionsSharp, paperPlane, paperPlaneOutline, paperPlaneSharp, partlySunny, partlySunnyOutline, partlySunnySharp, pause, pauseCircle, pauseCircleOutline, pauseCircleSharp, pauseOutline, pauseSharp, paw, pawOutline, pawSharp, pencil, pencilOutline, pencilSharp, people, peopleCircle, peopleCircleOutline, peopleCircleSharp, peopleOutline, peopleSharp, person, personAdd, personAddOutline, personAddSharp, personCircle, personCircleOutline, personCircleSharp, personOutline, personRemove, personRemoveOutline, personRemoveSharp, personSharp, phoneLandscape, phoneLandscapeOutline, phoneLandscapeSharp, phonePortrait, phonePortraitOutline, phonePortraitSharp, pieChart, pieChartOutline, pieChartSharp, pin, pinOutline, pinSharp, pint, pintOutline, pintSharp, pizza, pizzaOutline, pizzaSharp, planet, planetOutline, planetSharp, play, playBack, playBackCircle, playBackCircleOutline, playBackCircleSharp, playBackOutline, playBackSharp, playCircle, playCircleOutline, playCircleSharp, playForward, playForwardCircle, playForwardCircleOutline, playForwardCircleSharp, playForwardOutline, playForwardSharp, playOutline, playSharp, playSkipBack, playSkipBackCircle, playSkipBackCircleOutline, playSkipBackCircleSharp, playSkipBackOutline, playSkipBackSharp, playSkipForward, playSkipForwardCircle, playSkipForwardCircleOutline, playSkipForwardCircleSharp, playSkipForwardOutline, playSkipForwardSharp, podium, podiumOutline, podiumSharp, power, powerOutline, powerSharp, pricetag, pricetagOutline, pricetagSharp, pricetags, pricetagsOutline, pricetagsSharp, print, printOutline, printSharp, prism, prismOutline, prismSharp, pulse, pulseOutline, pulseSharp, push, pushOutline, pushSharp, qrCode, qrCodeOutline, qrCodeSharp, radio, radioButtonOff, radioButtonOffOutline, radioButtonOffSharp, radioButtonOn, radioButtonOnOutline, radioButtonOnSharp, radioOutline, radioSharp, rainy, rainyOutline, rainySharp, reader, readerOutline, readerSharp, receipt, receiptOutline, receiptSharp, recording, recordingOutline, recordingSharp, refresh, refreshCircle, refreshCircleOutline, refreshCircleSharp, refreshOutline, refreshSharp, reload, reloadCircle, reloadCircleOutline, reloadCircleSharp, reloadOutline, reloadSharp, remove, removeCircle, removeCircleOutline, removeCircleSharp, removeOutline, removeSharp, reorderFour, reorderFourOutline, reorderFourSharp, reorderThree, reorderThreeOutline, reorderThreeSharp, reorderTwo, reorderTwoOutline, reorderTwoSharp, repeat, repeatOutline, repeatSharp, resize, resizeOutline, resizeSharp, restaurant, restaurantOutline, restaurantSharp, returnDownBack, returnDownBackOutline, returnDownBackSharp, returnDownForward, returnDownForwardOutline, returnDownForwardSharp, returnUpBack, returnUpBackOutline, returnUpBackSharp, returnUpForward, returnUpForwardOutline, returnUpForwardSharp, ribbon, ribbonOutline, ribbonSharp, rocket, rocketOutline, rocketSharp, rose, roseOutline, roseSharp, sad, sadOutline, sadSharp, save, saveOutline, saveSharp, scale, scaleOutline, scaleSharp, scan, scanCircle, scanCircleOutline, scanCircleSharp, scanOutline, scanSharp, school, schoolOutline, schoolSharp, search, searchCircle, searchCircleOutline, searchCircleSharp, searchOutline, searchSharp, send, sendOutline, sendSharp, server, serverOutline, serverSharp, settings, settingsOutline, settingsSharp, shapes, shapesOutline, shapesSharp, share, shareOutline, shareSharp, shareSocial, shareSocialOutline, shareSocialSharp, shield, shieldCheckmark, shieldCheckmarkOutline, shieldCheckmarkSharp, shieldHalf, shieldHalfOutline, shieldHalfSharp, shieldOutline, shieldSharp, shirt, shirtOutline, shirtSharp, shuffle, shuffleOutline, shuffleSharp, skull, skullOutline, skullSharp, snow, snowOutline, snowSharp, sparkles, sparklesOutline, sparklesSharp, speedometer, speedometerOutline, speedometerSharp, square, squareOutline, squareSharp, star, starHalf, starHalfOutline, starHalfSharp, starOutline, starSharp, statsChart, statsChartOutline, statsChartSharp, stop, stopCircle, stopCircleOutline, stopCircleSharp, stopOutline, stopSharp, stopwatch, stopwatchOutline, stopwatchSharp, storefront, storefrontOutline, storefrontSharp, subway, subwayOutline, subwaySharp, sunny, sunnyOutline, sunnySharp, swapHorizontal, swapHorizontalOutline, swapHorizontalSharp, swapVertical, swapVerticalOutline, swapVerticalSharp, sync, syncCircle, syncCircleOutline, syncCircleSharp, syncOutline, syncSharp, tabletLandscape, tabletLandscapeOutline, tabletLandscapeSharp, tabletPortrait, tabletPortraitOutline, tabletPortraitSharp, telescope, telescopeOutline, telescopeSharp, tennisball, tennisballOutline, tennisballSharp, terminal, terminalOutline, terminalSharp, text, textOutline, textSharp, thermometer, thermometerOutline, thermometerSharp, thumbsDown, thumbsDownOutline, thumbsDownSharp, thumbsUp, thumbsUpOutline, thumbsUpSharp, thunderstorm, thunderstormOutline, thunderstormSharp, ticket, ticketOutline, ticketSharp, time, timeOutline, timeSharp, timer, timerOutline, timerSharp, today, todayOutline, todaySharp, toggle, toggleOutline, toggleSharp, trailSign, trailSignOutline, trailSignSharp, train, trainOutline, trainSharp, transgender, transgenderOutline, transgenderSharp, trash, trashBin, trashBinOutline, trashBinSharp, trashOutline, trashSharp, trendingDown, trendingDownOutline, trendingDownSharp, trendingUp, trendingUpOutline, trendingUpSharp, triangle, triangleOutline, triangleSharp, trophy, trophyOutline, trophySharp, tv, tvOutline, tvSharp, umbrella, umbrellaOutline, umbrellaSharp, unlink, unlinkOutline, unlinkSharp, videocam, videocamOff, videocamOffOutline, videocamOffSharp, videocamOutline, videocamSharp, volumeHigh, volumeHighOutline, volumeHighSharp, volumeLow, volumeLowOutline, volumeLowSharp, volumeMedium, volumeMediumOutline, volumeMediumSharp, volumeMute, volumeMuteOutline, volumeMuteSharp, volumeOff, volumeOffOutline, volumeOffSharp, walk, walkOutline, walkSharp, wallet, walletOutline, walletSharp, warning, warningOutline, warningSharp, watch, watchOutline, watchSharp, water, waterOutline, waterSharp, wifi, wifiOutline, wifiSharp, wine, wineOutline, wineSharp, woman, womanOutline, womanSharp
};

@jprevost-pro
Copy link

Hi,
You can import the whole list of icons with an alias, then use this alias in the addIcons()

import { Component } from '@angular/core';
import { IonicModule } from '@ionic/angular';
import { addIcons } from 'ionicons';
import * as ionIcons from 'ionicons/icons';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
  standalone: true,
  imports: [IonicModule],
})
export class HomePage {
  constructor() {
    addIcons(ionIcons);
  }
}

Regards,
Jérôme

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants