Questions tagged [ionicons]

The premium icon font for Ionic Framework

Primary site:

http://ionicons.com/

From Github:

We intend for this icon pack to be used with Ionic, but it’s by no means limited to it. Use them wherever you see fit, personal or commercial. They are free to use and licensed under MIT.

...

Ionicons is licensed under the MIT license.

https://github.com/driftyco/ionicons

144 questions
15
votes
4 answers

CSS\HTML - How to add Ionicons to CSS "content" property?

I'm using a custom switch toggle (from here) and I want to add an icon instead of regular text. When I paste the Ionicons code to the CSS content property it appears as a rectangle (some indication for the fact the character\font was not found). How…
Alex
  • 1,982
  • 4
  • 37
  • 70
12
votes
6 answers

How to use ionicon in Angular component?

I'm trying to add ionicons to my Angular 4 app. Here are the steps taken: In http://ionicons.com/ I downloaded the zip file and extracted it. I created a new folder in my Angular project named icons I dragged the ionicon.min.css file and the fonts…
TaliG
  • 121
  • 1
  • 1
  • 3
12
votes
3 answers

Use custom icons with tabs in ionic2

I need to use customs icons with tabs in ionic 2. Moreover I need to change the title color and icon, if the tab is selected. Example: ionic Tabs
Enric Gimenez
  • 121
  • 1
  • 1
  • 3
11
votes
3 answers

Unhandled JS Exception: getPropertyAsObject: property '__fbRequireBatchedBridge'

I've been having errors after errors to the point where I've reset my Metro Bundle and performed updates, errors from required module "699" to "700" have been coming up and now this. I believe I have all the required dependencies for Drawer…
10
votes
4 answers

How to change title of an ion-icon?

I'm trying to change the ion-icon title that appears on mouse-hover. Example: I've tried for at least a couple of hours to find a solution for this. I just don't know how i can access the title element of ion-icon via css to be able to change the…
famoha
  • 415
  • 4
  • 12
10
votes
4 answers

Rotate an ionicon on the page

I want to display directions with an arrow and was thinking to use the standard ionic arrow for the direction. Can I rotate the up arrow into any direction somehow? ion-arrow-up-a Here is an attempt from the comments below
El Dude
  • 5,328
  • 11
  • 54
  • 101
8
votes
6 answers

Ionic-Vue Ionicons 5.x.x doesn't show icon

I used ionic-vue with ionicons 5.0.1 but after call i was following https://dev.to/aaronksaunders/build-your-first-ionic-vue-app-18kj and https://github.com/ionic-team/ionic/issues/19078 tutorial, but stucked and…
Moch Diki Widianto
  • 133
  • 1
  • 2
  • 8
8
votes
3 answers

How to override the title "ionicons-v5_logos" when I hover over the github-logo provided by ionic

I'm trying to embed the GitHub Logo by ionic (v5) into my project which redirects to the GitHub repository of the project I made. The logo has this annoying title "ionicons-v5_logos" which appears when I hover over the icon. How can I remove the…
6
votes
3 answers

Ionicons version 5 with angular

How to add ionicons version 5 to angular, with version 4.5 there was a scss available and I can use in that way but now in version 5 ionicons use svgs and don't know how to integrate it with angular. Current approach In angular.json "styles": [ …
anthony willis muñoz
  • 2,346
  • 3
  • 16
  • 33
5
votes
1 answer

Vue warn Failed to resolve component: ion-icon

Following the usage at https://ionicons.com/usage, the ion-icon displays but I get this warning: Failed to resolve component: ion-icon My steps were: I used @vue/cli@4.5.11 to create a new app (vue create projectname) added
Vicky
  • 55
  • 1
  • 4
5
votes
0 answers

using ionicons 5 in vue.js

I want to use ionicons 5 in my vue.js project. If I use: every thing works fine but I want to use it just like…
Afshin Gh
  • 7,918
  • 2
  • 26
  • 43
5
votes
1 answer

How to import Ionicons (or other fonts) into a Vue-loader app?

After installing ionicons v3.0.0 with npm, I am having a lot of trouble importing the fonts into my app: // /src/App.vue @import '../node_modules/ionicons/dist/scss/ionicons.scss'; seems to point to the right path, however, I get a ton of errors…
Alex
  • 3,719
  • 7
  • 35
  • 57
5
votes
3 answers

How can I use CSS transform-scale with ionicons?

I have this simple snippet with four buttons with a CSS scale transform: .social-buttons { height: 90px; margin: auto; font-size: 0; text-align: center; position: absolute; top: 0; bottom: 0; left: 0; right:…
NineCattoRules
  • 2,253
  • 6
  • 39
  • 84
5
votes
3 answers

Chinese symbol instead of function or ionicon icon

For some reason, I am getting Chinese symbols instead of the right icon. I have the .ttf in app/fonts directory and .css under /app. Hope that you will find my mistake app.css .fa { font-size: 60; font-family: FontAwesome,…
David
  • 1,241
  • 20
  • 36
4
votes
1 answer

Ionicons package in Flutter showing this warning during build - Expected to find fonts for (packages/Ionicons/Ionicons, MaterialIcons)

I am using Ionicons pagckage for Icons in my flutter app. But when executing flutter build appbundle it is showing me this error - Expected to find fonts for (packages/Ionicons/Ionicons, MaterialIcons), but found (MaterialIcons). This usually means…
Vasudev Soni
  • 43
  • 11
1
2 3
9 10