Questions tagged [font-awesome]

Font Awesome is an iconic standalone vector font, initially developed for use with the Twitter Bootstrap front-end framework.

Filter by
Sorted by
Tagged with
0 votes
3 answers
42 views

HTML/CSS - Font Icons : Class from fontawesome not working when calling it from css file

I'm pretty "new" to HTML/CSS coding so apologies if this topic is trivial. This concern the use of font icons, more precisely Fontawesome. HTML FILE : In my html document, the icon is ...
joseldsm's user avatar
  • 103
0 votes
0 answers
18 views

FontAwesomeIcon with Nuxt 3 raises two lint errors in my code

I am using Nuxt 3 and want to have fontawesome. It actually works, but I have some lint errors that I am not getting rid of and I want to understand if I did something wrong or not. Here's part of the ...
Dani's user avatar
  • 53
0 votes
0 answers
43 views

Can't import custom fontawesome web icons in Flutter

Creating a custom icon on fontawesome using the icon wizard does not generate the custom icon code after importing the new web files (the icons.json and the custom .tff file). I made a new icon using ...
SOVERFLOW's user avatar
0 votes
2 answers
58 views

Getting in `require': cannot load such file -- ffi (LoadError) after installing gem 'font-awesome-sass', '~> 4.7.0'

Im using windows. I wanted to include font awesome icons to my project and so I added gem 'font-awesome-sass', '~> 4.6', '>= 4.6.2' to my gem file did a bundle install and got this: Fetching ...
Wellington Mitole's user avatar
0 votes
1 answer
39 views

Add fontawesome to shadowroot of webcomponent

I've created a JS script that creates a webcomponent. That webcomponent used Font Awesome icons. When I include the Font Awesome library to the head of my HTML, the icons work without any problems. ...
Dennis's user avatar
  • 530
0 votes
0 answers
16 views

how to create a SharePoint modern list with links to external sites with icons

I'd like to have a list of external URLs and also use font awesome icons in front of each of them. I first created a list with a link and an icon, but I don't think this is correct, and it just doesn'...
Ginnie2019's user avatar
0 votes
0 answers
16 views

FontAwesome half animation?

I'm currently trying to use their animations to make a transition animation. For example, if I press a button, I want it to play the first half of the shake animation with the snowflake icon, swap to ...
stevenyoussef's user avatar
-4 votes
1 answer
37 views

font awesome icon displayed as a square [closed]

I wanna make an icon for my sidebar using font awesome, but the icon turns to a square. I can use cdn, but i wanna try offline. I put my all.min.css in css folder in public folder enter image ...
Muftia Sifana's user avatar
1 vote
0 answers
25 views

Can't use data for fontawesome icons in vue

Here I am trying to get individual icons for subclasses here <v-col v-for="sub in subclasses" :key="sub.sub"> <div class="d-flex justify-...
Abdullah Semih Gür's user avatar
0 votes
0 answers
15 views

Is there a way to check which domain is accessing my FontAwesome kit?

Today, out of nowhere, I received an e-mail from FontAwesome warning me that my kit has received over 60% of my allotted 10,000 pageview limit for this month. Problem is, I don't even know where are ...
samgamgi's user avatar
0 votes
0 answers
26 views

Fontawesome icons displayed incorrectly in pyplot

I've got some pyplot charts with annotations using fontawesome icons. Everything worked fine in the past until I was required to update my Python Interpreter from 3.10 to 3.11. Now e.g. a simple left-...
quantc0d32's user avatar
0 votes
0 answers
30 views

FontAwesome 5 doesn't show in Chrome when css-called, but shows in Safari

On the site <www.lichaamengeest.be> there is use of FontAwesome 5.15.4. All icons show well, except for the ones that are called from the css, like "\f104", "\f0dd", "\...
chechu's user avatar
  • 245
0 votes
1 answer
32 views

Problem with FontAwesome font-weight when using fa-regular

Chrome 115 and 117 (also in Edge) fa-solid displays ok but regular display as square here how it look like when trying to play with font-weight in the DevTool its look like the browser cant display ...
KaptainM's user avatar
0 votes
0 answers
22 views

How to get icon name fontawesome from image png

I have some image png, I want to get icon name of image. How to get it? I tried using Bard to get the icon name but it didn't work
phuocantd's user avatar
  • 432
0 votes
1 answer
20 views

Social Menu Icon issue - no hyperlink when adding class

I'm using my own infinity news child theme on littleseabear.com. infinity news uses ion icons and for the icon to appear in the social menu the css goes something like: social-icons ul a[href*="...
VineHallow Crookshanks's user avatar
0 votes
1 answer
43 views

How to implement dynamic icon loading in remix.js?

I would like to use some icon library in remix.js. As remix doesn't use babel it is not possible to use dynamic import of the icons. What is the easiest way to implement fontwaesome or remixicons with ...
Humberto de Angeli Neto's user avatar
0 votes
0 answers
28 views

How to import icons from FontAwesome and shake all the unused ones?

Our current implementation loads all of the icons into the font awesome library: import { library } from '@fortawesome/fontawesome-svg-core'; import { fas } from '@fortawesome/pro-solid-svg-icons'; ...
itaied's user avatar
  • 171
0 votes
1 answer
64 views

Difficulty Positioning Elements in CSS with position absolute & relative

I'm currently working on a project where I'm trying to adjust the positioning of elements within a sidebar. The sidebar contains Font Awesome icons and corresponding text elements, and I'm attempting ...
Your-neigbourhood -developer's user avatar
0 votes
0 answers
18 views

Why does this technique for using fontawsome 5 in text on a canvas fail for icon fa-plug when it works for fa-amazon?

This is about using Fontawesome icons in text on a html5 canvas. Why will the technique NOT work with the fa-plug icon when it does work with the fa-amazon icon. The code is in the snippet below but ...
Vanquished Wombat's user avatar
0 votes
1 answer
32 views

Font Awesome icons not displaying despite local hosting and CORS fix

I'm encountering an issue where Font Awesome icons are not displaying on my live web server despite hosting the Font Awesome files locally. I initially faced a CORS issue, which was resolved by local ...
Your-neigbourhood -developer's user avatar
0 votes
1 answer
37 views

vertical alignment of google-material-icons when replacing fontawesome icons in a bootstrap page

I have an html page, that uses bootstrap 5.3 for layout (e.g. buttons) and fontawesome 6.4 for icons. Both bootstrap and fontawesome are included via a CDN. I want to transition to the latest google ...
Michael 's user avatar
  • 1,853
0 votes
0 answers
18 views

Bulma + Font Awesome Just Displays a Hex Value

I am using bulma as my default css framework. I used npm to download fontawesome-free. I have included it into a global scss that compiles to css on build. I follow the Bulma instructions here : https:...
LCaraway's user avatar
  • 1,267
0 votes
0 answers
25 views

TinyMCE custom button with font awesome 6 icon

I am trying to add a custom button to TinyMCE which has font awesome icon on it. In the page header I am referencing my fa kit <script data-search-pseudo-elements src="https://kit....
StripyTiger's user avatar
0 votes
1 answer
53 views

Font awesome 6 icons not showing afte Vite build

I have a new laravel project and imported Font awesome 6 using npm. When i run "npm run dev" all icons show up, but after running "npm run build" I get 4 console errors that the ...
Lesley Peters's user avatar
0 votes
0 answers
31 views

after linking to font Awesome link works well if i use @font_face but if not it shows a weird link. i cannot seem to understand the problem

i am trying to add an icon from font_awesome i followed the manual and took the link tag to the libary from https://cdnjs.com/ i have some old code defining specific certain icons using @font_face , ...
omerke's user avatar
  • 1
0 votes
1 answer
115 views

Inject Font Awesome token as build secret to .npmrc via Dockerfile from GitHub secrets

We currently use the Font Awesome library for fonts and icons in our application. It's registered inside the the .npmrc file as below: @fortawesome:registry=https://npm.fontawesome.com/ //npm....
user2140740's user avatar
0 votes
0 answers
32 views

Font Awesome icon borders changed size from v5 to v6

I thinking about upgrading FA from version 4 to version 6. The size of the borders of icons is unexpected in version 6, so the placement of the characters is shifted in my app. The v6 borders are the ...
Willy McAllister's user avatar
0 votes
0 answers
19 views

My question is why font-awesome icon was not working properly

This is font-awesome icon hi there give me the solution of this problem, why font-awesome icon was destroy every time and how to solve this problem so please give me the solution thank you so much . I ...
Amit Kumar jha's user avatar
0 votes
2 answers
184 views

How to add a fontawesome icon in html according to the value of an input

Sorry if my question seems stupid as I am a total newbie. I'm stuck with the following problem. I need to add a fontawesome icon as the content of an input text according to a very simple condition ...
angie's user avatar
  • 7
0 votes
1 answer
21 views

How do I add FontAwesome to Vue/Express/hypernova-vue app

The app I'm working on is a Rails app using hypernova-vue to allow Vue3 micro frontend apps/components to be used throughout the site. I've built a small, private npm library of components used by the ...
Stickel's user avatar
  • 11
0 votes
0 answers
1k views

Twitter X using Font Awesome 6 not working

Why does the Twitter X icon not work in this code using Font Awesome 6? Any help is appreciated. This is the link to the Font Awesome 6 Twitter X details: https://fontawesome.com/icons/x-twitter?f=...
user13928344's user avatar
0 votes
1 answer
36 views

Use font awesome icon in nuxt watcher

In my nuxt component, I know I can use the following to display an icon from Font Awesome:- <fa icon="circle" /> But what do I need to do to use the same icon when I'm building HTML ...
bodger's user avatar
  • 1,162
1 vote
0 answers
14 views

React Native 'npm run ios' hanging after installing FontAwesome

I'm a React Native newbie and am working through a React Native Course on Udemy. I installed FontAwesome into my RN project (which is from the out-of-the-box setup of RN), and now when I run the npm ...
Pianoman's user avatar
0 votes
1 answer
112 views

How do I display font awesome v6.4.2 brand icons in angular?

It is a fresh project with angular and font-Awesome. I am missing something not sure what it is. The imports and adding the reference. Version of Fontawesome "@fortawesome/angular-fontawesome&...
Master's user avatar
  • 11
1 vote
1 answer
52 views

My fontawesome and bootstrap icons dont show up in azure

I use express and html to run an html file, and normally the icons show up very good if i run it myself on my own port, but if i for some reason run it on azure, the icons just show up as little boxes,...
Ara Dleir's user avatar
1 vote
1 answer
82 views

How use Your Kit custom fontawesome icon in angular project

I have a fontawesome subscription (paid plan) and I have created a few custom icons. Now, I want to know that how to use them in my angular app. This is my package.json file dependencies. "@...
Nuwan's user avatar
  • 67
0 votes
1 answer
35 views

Align normal icon with stacked icon and the same size

I have two icons where I want to align them with the same size. Expected results: Current development: If I try to set the stack icon small, it looks like this: So, I want to have them aligned. ...
Jesus's user avatar
  • 355
1 vote
3 answers
44 views

Button hover effect not affecting icon inside button

I'm trying to show underline effect on button with font-awesome but I want to affect both text and icon but it affects only text inside button ignoring icon completely (as in example). Is there any ...
asdfgh's user avatar
  • 2,910
1 vote
1 answer
44 views

Font Awesome loading icon doesn't show up in WooCommerce Admin list

Based on Custom input fields to update stock quantity in WooCommerce Admin Product list previous answer to one of my questions. The following code adds a custom button for the quantity column that ...
GFT's user avatar
  • 112
0 votes
0 answers
20 views

Font-awesome animation not working via RDP

Our users connect to some rdsh Windows servers and are using mstsc to connect on them Each time they log into the farm, the "Play animations in Windows" is disabled by default. The user can ...
rweiss's user avatar
  • 1
0 votes
2 answers
64 views

Unable to rotate font-awesome icon in Angular 15 with CSS

I'm trying to get a button with an fa-icon to rotate 180degrees and then rotate backwards the other way when it's clicked again. So far I have this (reproduced in the stackblitz), but the icon just ...
Blake's user avatar
  • 83
0 votes
1 answer
36 views

Invert plus circle font awesome icon colors

I want the font awesome icon as the following image: So I try to add that as the following code: .custom-icon { position: relative; color: #a3a1a1; font-size: inherit; } .custom-icon::...
Jesus's user avatar
  • 355
4 votes
2 answers
3k views

Strange error in console after installing Font Awesome 4

I have installed FontAwesome 4.7 without any file changing. Works alright. But why Firefox shows these strange warnings? There are a lot of them. Can't understand what is wrong. <link rel="...
Jurgen's user avatar
  • 223
0 votes
0 answers
82 views

Fonts in MAUI custom controls

I'm trying to create a MAUI custom control that uses Font Awesome in a separate project (library). I'm not sure where I have to register the font or it must be deployed separately from dll/project and ...
Denis De Pauli 's user avatar
0 votes
0 answers
92 views

Adding fontAwesome to wpf

I installed the Font-awesome-wpf package via the NuGet Package Manager, am trying to add an the exchange icon with the code below <fa:ImageAwesome Icon="Exchange" Width="30" ...
Eric Muganga's user avatar
1 vote
3 answers
103 views

Html icon not showing in chrome

I already link a font awesome cdn link in head but I can't find icon. Someone help me I want menu icon to do responsive website. What should I do? I also open in Firefox. Icon also not showing there. ...
Adrian's user avatar
  • 21
0 votes
0 answers
25 views

CSP hash values for external files which change - hash no longer valid

I have recently been tightening up the content security policies for one of my sites. This site uses font awesome for its icons. As part of this, I've included https://*.fontawesome.com/ under several ...
penguin178's user avatar
1 vote
1 answer
105 views

Issue with TinyMce and Fontawesome icons on Moodle platform. Icons does not appear

Since a long time we used Atto as text editor on Moodle. On the footer we use fontawesome icons for social media links. This is the code we mostly used with Atto. <div style="text-align:center;...
Benjamin Cabassot's user avatar
1 vote
1 answer
85 views

Difficulty getting the Font Awesome Brand icons to show up

I am trying to get a Font Awesome GitHub icon to show up on the client side, but it doesn't show up. I am using next.js, tailwind, and react.js to build my first portfolio. I have got the following ...
Janine Milena's user avatar
-1 votes
1 answer
139 views

Problem sizing the icon from font awesome using react + tailwind + next.js

I've been trying to learn react and tailwind and for some reason I can't size the icon from font awesome. I tried to do everything in my power, using the size="sm" and h-px w-px from ...
Igor Aguiar's user avatar

1
2 3 4 5
112