What is Reddit's opinion of Font Awesome?

They're likely using an icon pack like font-awesome but probably not FA itself as they don't have a circular message icon nor any message icons styled like that, and the Steam icon is not quite right. Steam's is not an uncommon one to find in icon packs.

The change is pretty subtle. Accessibility could be a thing.

Also the progress bar feels disconnected from the controls. It's at a higher level in the visual hierarchy, which is sort of opposite what you'd expect.

Last note is that the "play" button feels like the wrong icon. This would make sense as an audio player, but for an upload I would expect the standard upload icon. (https://fontawesome.com/v4.7.0/icon/upload)

Very clean design, and nice colours. There's lots to like about it.

Is the main draw to this is that it’s free? How’s it compared to fontawesome’s free (also open source) and pro versions? Backwards compatibility? This seems good for prototyping a school project but hard to justify production use compared to some of the other production ready alternatives out there, also doesn’t seem complete but hey it’s free so can’t complain too much, but it’s being posted in multiple subs by same dude so can’t help but be skeptical and slightly annoyed

https://fontawesome.com/

Wallpaper: here by me
WM: dwm
Terminal: st
Fonts: FontAwesome4 + Tamzen
Compositor: picom

That package is for mobile application. It may seems like it has icons for everything but really, they are not.

If you want an icon pack widely used with plenty more icons, check Font Awesome: https://fontawesome.com/icons?d=gallery&m=free

It's unlimited use EXCEPT if your business has 100 or more employees. So for a personal dev it's totally unlimited. Hell, even my shop could work with Pro just fine for a looooong time.

OS: Xubuntu LTS (it's a lot easier to configure than Debian)
DE: Xfce
GTK theme: Arc-Darker (arc-theme)
Icons: Papirus (papirus-icon-theme), I know the logout icon stands out, but it has to be used both on the panel and in the Whisker Menu.
UI font: Noto Sans (built-in)
Terminal font: Ubuntu Mono (built-in)

Dock: Plank (plank)
Panel applets:

Whisker Menu (built-in), the icon – its colour was changed to #bac3cf, you can do it by editing the svg file in a text editor.
Window Header – Buttons (goodies.xfce.org), it's actually set to control only maximised windows, I just wanted to show it.
AppMenu Plugin (xfce4-appmenu-plugin), I've installed unity-gtk2-module and unity-gtk3-module to make it work with almost all apps.

Credit for how to do it goes here: https://minimaxir.com/2021/08/vqgan-clip/, specifically his script https://colab.research.google.com/drive/1wkF67ThUz37T2_oPIuSwuO4e_-0vjaLs?usp=sharing

I used all standard parameters and "tzeentch chaos warrior reddit.com/r/totalwar" as the prompt, with this nurgly icon (https://fontawesome.com/v5.15/icons/diagnoses?style=solid) as a starting seed.

Taking into account your basic knowledge well done on putting this together, however the color scheme looks dated, the Horizontal line, grey on pastel navy contribute to that. Consider:

Using a totally white canvas.
Focus on typography, Serif and Bold darker shade of grey for headings. Sans serif and a lighter shade of grey for paragraphs. Use Google fonts to find fonts add them to your CSS.
Use a more modern icon pack such as Fontawesome.
I recommend Webcreme for inspiration.
In your main heading replace the << / >> Characters with Double quotes.
Consider using Twemoji to replace your hobbies icons. (Twitter emoji implementation)

I believe after that you’ll end upvwith a more polished, modern design. Keep learning we all are! I hope this helps.

As I'm arguing elsewhere in the thread, there is no use case for an icon without semantic meaning.

Font Awesome themselves say that title attrs are "to provide a tooltip for sighted mouse users." Source. I'm not sure what a11y point you think you're making here.

Regardless, their own example code is dogshit compared to some HTML that achieves the same result without using a font icon:

&lt;i aria-hidden="true" class="fas fa-car" title="Time to destination by car"&gt;&lt;/i&gt;
&lt;span class="sr-only"&gt;Time to destination by car:&lt;/span&gt;
&lt;span&gt;4 minutes&lt;/span&gt;

&lt;img src="car.svg" alt="Time to destination by car" /&gt;
&lt;span&gt;4 minutes&lt;/span&gt;

Google's Noto fonts should cover everything anyone could reasonably need. For icons in general Font Awesome seems to be the gold standard.

You're getting a bunch of errors and warnings in console if you open up your site. Fix those.

Your favicon is just the react logo, if you don't want to make your own, then just use some icon generator with the first letter of your name.

In Chrome, in dev tools, look for audits, run the lighthouse audit. It'll give you a bunch of things to work on and fix to get better ratings.

I would place more emphasis on your past projects, let them take up more visual space, and make your skills take up less.

Don't use bars for skills, they mean nothing. What does 2/3 of the bar being filled actually mean? So just use a brief summary or what have you to say what you can actually do. If you're strong in react, say that. Link projects that use react. Link to github code that shows you used react.

The + symbol when you hover over projects should instead be some icon that looks like it's going to indicate a bigger size. Like youtube's fullscreen icon. Or like this one from FontAwesome. Or like a magnifying glass zoom in icon.

Your linkedin app isn't directed to the right place.

Overall not bad! The lighthouse audits are super important though, work on them!

I checked fontawesome’s recommendation for icon fonts and they are staunchly against alt text i suppose because they are technically Unicode and not images. Aria-label it is then. Thanks!

Pic a colour pallet. A logo is for identifying your brand and colour is part of that purpose. A specific colour can be used across your brand livery, as part of your signature. A kaleidoscope is bad for that.

A logo is not supposed to be pretty. It's not an aesthetic thing, it's for identifying your business wherever your brand in any published material, from the typeface, there icon, the colour, and other stylisation.

For now I'd just make the 'e' pink and the 'thi' blue, and then the pink 'e' is your icon.

The problem is thousands of businesses use an 'e' as their icon so it's not very distinctive. It will be confused with a lot of logos. I'd say you need an icon of some kind. Look for inspiration on icon websites by searching for words related to your domain, like 'data'.

https://fontawesome.com/icons?d=gallery&q=Data

https://www.iconfinder.com/search/?q=Data

Think about what people associate with 'privacy' and 'data' and 'control' and 'ownership'.

Things on the right are handled by bar config: status.toml
Stuff on the left (workspaces) and bar color are handled by sway config: config
workspaces names: line 112-120 You will need FontAwesome.

color scheme: line 219-221, 232-236

Not sure if it completely matches your use case (it's intended more for web applications), but Font Awesome is a pretty extensive icon set that's very nice. I don't know how much configuration it will take to get it working on a desktop system (as opposed to on a webpage), but I've definitely at least heard of people using it for their desktops.

> embedding SVG

That's actually becoming more popular recently to implement icons. It's even used on this very page! Also, e.g. Font Awesome.

A mim parece-me font-awesome, mas tou em mobile can't be sure Font-awesome

Update: aparentemente usam isto fontello, e confirma-se que é font-awesome.

Ah, that's a little bit different if you're setting the value of a submit input, sorry, I missed that context. In that case try just preceeding the unicode value with \u in your string, to indicate that you want that unicode character and not the literal number:

document.getElementById(element).value = "Submit \u2192"

That newline isn't going to work the way you want though; if you want the contents of the button to flow over two lines you will do much better using CSS- like this: https://jsfiddle.net/acvhx07g/

It's also worth considering if you really want the unicode character if this is purely decorative- it's often much easier to make this kinda stuff look nice by using icons, such as the FontAwesome set.

For (2) I guess you could do this in the view, so that you have something like this:

next_album = Album.objects.filter(title__gt=self.object.title).order_by('title').first() if next_album is None: next_album = Album.objects.filter.order_by('title').first() context["next_album"] = next_album

So, if there isn't a next album - because we're at the end, then we get the very first album as the "next_album". And similar for the previous album.

BTW, with icons it's handy to add some tweaks so it's more accessible for screen readers. e.g.:

Information:

Wallpaper
WM: XMonad
Bar: Polybar
Compositor
Polybar Icons
TE: Kitty

Commands displayed:

Neofetch
CMatrix
Vim

I use Font Awesome 5 to display the icons in my polybar. Check out my polybar config to see how they work.

In qtile at least It's simply a text box widget.

I use font awesome for the arrows.

So all you nead is download the font and then go to their website and copy the character you want: https://fontawesome.com/v5.15/icons?d=gallery&p=2

After that paste the character into the text section after wich you just set the collors size and padding.

Here is how I have it.

widget.TextBox(
text = '',
background = colors[0],
foreground = colors[4],
padding = 0,
fontsize = 45
),

Hope this helps.

Font Awesome is almost definitely the most popular. I’ve seen Weather Icons used too, including in some of these modules.

Oh no no no, using unfont on the client is a bad idea since it imports all the icons and is not tree-shakable by design, so the final bundle will probably be bigger than that with fonts. I should have written that right on top the docs and added a big console warning, I knew that.

Please consider using font awesome's own react binding: https://fontawesome.com/v5.15/how-to-use/on-the-web/using-with/react

I might add other icon kits someday, thanks for the nerdfonts lead!

The Font Awesome documentation has the info that you'll need:

https://fontawesome.com/how-to-use/on-the-web/advanced/css-pseudo-elements

In short, it would look something like this, but there's probably some other CSS code (which you can find in the documentation) that you'll need to add, too:

.menu-item a::before {

font-family: "Font Awesome 5 Free"; content: "\f007";

}

And you'd change f007 to the correct icon which you can find by visiting the icon's page on the font awesome site. (Like here where it says f398.)

I haven't done this but if you need quick symbols, get the free version of fontawesome (https://fontawesome.com/how-to-use/on-the-desktop/setup/getting-started) or the Google Material font (https://github.com/material-icons/material-icons-font/tree/master/font) - only to name two.

Kykou can insert the icons in your text processor of choice by adding the icons with the insert symbol function. Changing size and colors is easy and the symbols are always crisp as it is vector graphics.

Yep, this is nothing ready made, but hope this helps

Ah, ok. Slightly unclear but then if what you’re saying is you just want to reference their social link in the main content section then, I think, it gets slightly fiddly.

Either way - make sure Font Awesome is loaded into the site to display the icons. You then need to enter the font awesome tag to show the relevant icon. If you’re just typing that into the main content box it gets a bit fiddly though.

Host: Optiplex 755 Ultra Small Form Factor
OS: Debian Buster (64 bits)
DE: XFCE
WM: xfwm4
WM Theme: Numix
GTK2/ GTK3 Theme: Envi-gaps
GTK3 Theme: Numix
Icon Theme: Numix-Circle
Terminal: xterm
Terminal Theme: Nord
Terminal Font: CPMono_v07 Plain
Wallpaper: #678A9E
Weather on the CLI: https://github.com/chubin/wttr.in
Icons on the XFCE Panel: https://fontawesome.com/
Info on XFCE Panel: GenMon

Interesting. There are some icons which are combination of two shapes, like this icon from FontAwesome. I think that sometimes it works ok because it has become a fairly common usage of that icon (or something like it) to indicate file import, but I think that any time you have two shapes combined there is a cognitive load which requires the user to perceive and understand both shapes and then combine them. If the combined shape is common or easily recognized, maybe it isn't so bad, but if it is something that the user hasn't seen before, it might detract from the learnability of that icon. I guess if it is clear enough, it might be easy to remember which would somewhat counteract the initial difficulty.

The link in your post works fine for me.

Font Awesome 3 icons can be found at https://fontawesome.com/v3.2.1/icons/, Font Awesome 4 icons can be found at https://fontawesome.com/v4.7.0/icons/, and the new Font Awesome 5 icons can be found at https://fontawesome.com/icons.

Wallpaper: This modified by looking for author atm...
Icons: Font Awesome
Dock: Polybar

Please ask if you're interested in anything else!

This is awesome! bookmarked for sure. I have never heard of collectui.com, I usually just use dribbble which gets frustrating because all I want to search for is ui designs, so this is perfect.

I use https://fontawesome.com/ quite regularly!

You can use FontAwesome on GMBinder, pretty easily. I’ve done this on a couple of pages, but I can’t get to the links to share. I don’t think game-icons.net works the same way, unfortunately.

Made this, it clears the current content and loads 2 sites inside iframes, the only problem is you won't be able to load sites that have the sameorigin restriction which is most of the big ones.

Run this from the js console or from greasemonkey

// Change this let site1 = "https://fontawesome.com" let site2 = "https://humblebundle.com" let site1Width = "70%" let site2Width = "30%"

let i1 = document.createElement('iframe') let i2 = document.createElement('iframe')

i1.style.width = site1Width i2.style.width = site2Width

document.body.innerHTML = '' document.body.style.margin = 0

i1.style.height = '100vh' i1.style.border = 0 document.body.append(i1)

i2.style.height = '100vh' i2.style.border = 0 document.body.append(i2)

i1.src = site1 i2.src = site2

Well, it's hard to tell without seeing the css file, but a couple o quick solutions:

Align the "Accomplishments and Work" columns: Most likely you have those columns separated by divs. To align them, you could use:

margin-top: {value}; eg: margin-top: 10px; (check the right value, by testing)

A possible better way to list the PROGRAMS towards the bottom. Maybe a bullet list?: a list, using icons in the left. You could use https://fontawesome.com for the icons. The only downside is that using font icons is a little more tricky. But a simple list would do it. Example:

<ul>

<li>Adobe Photoshop</li>

<li>Adobe After Effects</li>

</ul>

I hope it helps.

I used Font Awesome here, but I can also recommend Fontello where you can select which icons you would like to use from several icon sets and add your own icons.

I just had a go using your bootstrap link above in a boilerplate HTML document and couldn't get any icons to show at all. Got a proper link by adding a project name here and it works great.

Answer: Reddit, like many websites on the internet, implements its icons with a special font instead of separate images. With some CSS trickery, it can tell your browser to put a specific letter in that font, which would make it appear as a magnifying glass. Other fonts implement these same letters with their own meanings (for example, using some of them to show brand logos as you've discovered).

When drawing "text" with a font that's not available (such as the reddit icons font that hasn't loaded because your network is slow), your browser and operating system do their very best to show you something, even if it means using a different font than the one the website requested. For some reason, your operating system had the FontAwesome font available to it. Since that font implements the characters used in the reddit ui, your browser used it to draw the icons. It happens that the characters reddit uses for its ui icons matches the section of the FontAwesome font set aside for brand icons

Given it's an open source project, them using an open source icon makes perfect sense. The license for fa-shield (and all of Font Awesome's stuff) is pretty open, so they're in effect using another open source project, and giving them some exposure (if minor) in the process.

Within the community of "good, popular password managers", it's pretty distinct, to be fair. Security products as a whole, and perhaps even just all password managers, perhaps not. But the big ones, yeah.

These look like Fontawesome Icons which are usually loaded through a custom webfont.

Maybe your Firefox is blocking the webfont? If something is blocked, you would see this in the DevTools. Right click → Inspect → Reload Website. Check either the "Console" tab or "Network" tab.

Thanks! The logo comes from https://fontawesome.com/v5.15/icons/windows and as for it looking like Windows 10, the idea of this was to replace my personal website and have the experience be that a visitor is siting at my desktop looking through my files.

These are the Font Awesome free icons - you can browse them here. You should be able to use them by following the same format that you have already discovered.

Check out this example brew that I threw together.

Two things I would consider. Doesn't mean you have to do them, and you didn't do anything wrong, just two things to consider:

Try doing all your Pixel measurements as rem. Some would calculate the numbers based on the base font size of the browser or website, but I tend to just use Firefox or Chrome, inspect and play around with things until I get a close match.

I personally like rem because its size is correctly when one zooms. It could be because people will just zoom on their screen, or some who decide to set things up as bigger so they can read things more easily.

Try out fontawesome. I will still pull up a PNG or SVG for an image I can't find, but I've found using fontawesome is so simple and it covers a lot of those little symbols that you might use. Plus they are a font so you can simply size them using font size and treat them as text.

Perhaps not the answer that you're looking, but take a look at FontAwesome, they are not icons per se, but you use as such.
they look awesome (doh!!!) with GenMon and since they are a font, if you switch to a light theme, they'll turn onto a dark variant automagically.

FA typically uses a common declaration: https://fontawesome.com/v5.15/how-to-use/on-the-web/referencing-icons/basic-use

so assuming you load the FA sheet first, add .fas{font-display: block} to your css, and that should add the display property to all FA icons.

I’ve had good luck finding symbology packs here https://esri-styles.maps.arcgis.com/home/gallery.html?view=grid&showFilters=false&sortOrder=desc&sortField=modified

You could also check out:

https://fontawesome.com/

https://ultimatesymbol.com/officialsigns&icons3

Thank you for warm word! ❤️

Google material icons for buttons https://fonts.google.com/icons?selected=Material+Icons:beenhere

And font awesome icon for spin https://fontawesome.com/v5.15/icons?d=gallery&p=1

It's a bit of a tacky solution but it works great:
I changed the extension CSS to use a custom font and font size. Then I used Font Awesome to assign a certain icon from that font to suiting workspace with dconf-editor (instructions). I can write more elaborated instructions and share some of the CSS to make it clearer if you like :)

> but it's listed under "Supplementary private use Area-B"

Yes. This means the Unicode consortium didn't put a meaning behind it, and any font designer can use it for any glyph they like without breaking the spec (with some restriction, it is left-to-right, etc).

For example, Font Awesome uses the private use area to put in icons for websites to use, some people uses it for klingon, etc. I'm not sure if anybody actually uses U+10FFFD.

> I heard somewhere that U+10FFFD was able to encode all of the valid Unicode characters at once, but that sounds like a lie

This is false and doesn't really mean anything.

Oh, the icon is the caret icon from the awesome font. The config was based on DistroTube's config if you want to check it out. I can also share the dotfile for my version if you're interested.

Edit - awesome font cheat sheet: https://fontawesome.com/v5/cheatsheet

Glyphs can be added in two ways. Firstly via their unique unicodes, which would be added into your template flags in the commands section, e.g “\xf17c”. Another way is to paste the actual glyph into the template section of the xmobarrc. Check out https://fontawesome.com/v6.0/icons to search for glyphs and unicodes.

Finally, in my experience I had issues with glyphs appearing when added directly into the template section. This is because I hadn’t got a UTF8 locale set. To remedy this ensure a locale is set that supports unicodes e.g for British English it would be “en_GB.UTF-8” rather than just “en_GB”.

I hope this helps.

Use Material Icons, Ionicons, Fontawesome or similar.

Please note that as far as I know the Ionicons script link is broken. I always use an earlier distribution link of it then.

Ah, sorry, you're right. I thought it was a typo, but it's actually @fortawesome (confusing naming idea!)

Have you installed the Vue Font Awesome component mentioned in #3 here: https://fontawesome.com/v6.0/docs/web/use-with/vue/

I just happened to come across your post because I am also having issues with Font Awesome. But i am having issues with their site not loading the actual icon pages. So I have trouble loading

https://fontawesome.com/v5.15/icons/accessible-icon?style=brands

And not https://fontawesome.com/

So just one possibility you might want to also check.

If you are using the fontawesome CDN, you might want to change it to something else and try. I think there is something wrong with their hosting service.

Font Awesome has a pretty good library. Not free and not sure if the integration in HA supports their paid plan. https://fontawesome.com/v5.15/icons?d=gallery&p=2&q=star%20wars&c=science-fiction

Edit: there are some freebies

I mean considering the fact that their logo is just the shield glyph from Font Awesome, yeah, you're gonna see it a lot of places. Honestly the only truly dumb decision I've seen that Bitwarden has made.

https://fontawesome.com/v4.7.0/icon/shield

Well I managed to do it by ```

on head (you need to get your own cdn on fontawesome.com)

on body

<i class="fa fa-facebook"></i> iconname

icon reference

https://fontawesome.com/v4.7.0/cheatsheet/

Was looking for something like the Android pack too and the best one I could find was this here: https://www.pling.com/p/1308970/

But maybe you can make something with Font Awesome?

I made it, using Dracula theme colors and fontawesome Fedora's logo.

Link.

Make sure the you have the link to the css in the head of the index.html. https://getbootstrap.com/docs/3.3/getting-started/.

Also the version of Bootstrap you are using is old. For icons it's recommended to use Font Awesome instead.

I used the fonts from Font Awesome that allowed me to use icons in the bar. I used that for all the icons you can see, as well as the Powerline effect on the right (the arrows are just another icon, I think it's called caret-left). You can check their website. If you still have trouble I could upload a snippet of my config

Go to r/unixporn/, r/UsabilityPorn/ and maybe even r/unixart/...
Take a look at what the cool kids and their Incredible Customized Desktops are ricing right now ;)
IMHO, you don't need an icon pack, take a look at Font Awesome and the Panel's Genmon Plugin.
There is a lot of fun you can have using those two, if you ask me.

hi /u/powerappsroadmap, I haven't been able to get this to work. I'm probably missing something really obvious...

Download FontAwesome from here
Go to Transfonter and ensure Base64 coding is turned on.
Upload FontAwesome/webfonts/fa-regular-400.ttf to Transfonter and click convert.
Download and extract the archive of the converted font.
Open and copy the contents of the .css file.
Go to PowerApps, and paste the contents of the css file in the Image property of an Image object.
Wrap the pasted css string with the following. Make sure the css is in place of the REPLACE comment line.

"data:image/svg+xml," & EncodeUrl( "<svg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'> <style>

//Replace this with the contents of your CSS file

//This line styles the text below to turn it into the icon .custom { font: 80px 'Font Awesome 5 Free'; fill:black } </style>

<text x='10' y='80' class='custom'>NAME OF FONTAWESOME ICON</text> </svg>" )
Replace 'NAME OF FONTAWESOME ICON' with the name of a FontAwesome icon, e.g. heart

DONE

When completing these steps I can see the cropped beginning of the word heart, but no icon. Any ideas where I may be going wrong?

I've just created a new user on my system, with defaults from /etc/skel.

I introduced your settings and these are the only ones that are present when it comes to language settings.

I added xset fp+ ... to my .xsession to load the font and still when I edit the file containing fontawesome icons (in nvim, not the stock nvi) I see empty rectangles instead of the icons.

If you copy and paste any of the icons from here in your xterm - do you see them? Because in my case I don't see anything in xterm, but I do in st.

I think I understand what you mean. I would think of any significant landmarks or hot spots around you locally. I see lots of companies' websites that have a picture of a significant landmark in the city to sort of say, "we have city pride". If you're looking for an icon, my best bet would be the GPS marker that's linked below.

https://fontawesome.com/icons/map-marker-alt?style=solid

Icons: 1. Download Font here: https://github.com/v1nc/T-UI-Expert/blob/master/app/src/main/assets/lucida_console.ttf?raw=true 2. Move file to t-ui/ and rename to font.ttf 3. config -set system_font false 4. restart 5. Download test file here and move to downloads 6. cat Download/icons.txt to see all icons 7. Copy icons you want from icons.txt or https://fontawesome.com/icons?d=gallery&m=free 8. Paste icons into t-ui/alias.txt or use alias -add

At a glance, it looks like you might be mixing font-awesome versions. It looks like you imported 4.4.0, which uses slightly different class names than 5.x, which is probably what you were looking at for documentation. (Here are the docs for 4.7.0, which should be roughly equivalent to 4.4.0.)

Also, I think far is only available with a Pro license.

I think you have three options:

Stick with 4.4.0 and use fa instead of far in your current code (and double-check that all of the icons you chose were available in 4.x)
Upgrade to 5.x and use fas (solid) with a free license
Upgrade to 5.x and use far (regular) with a pro license

Hope that helps!

For icons, I recently started to use Font Awesome. Super easy to use and they look great.

https://fontawesome.com/

For logos, if you google "logo maker" there are multiple sites that design logos for you for free. If you're looking to customize, there are a lot of graphic designers for cheap on Fiverr that I plan to use in the near future.

Thanks. I got that icon from https://fontawesome.com/v4.7.0/icon/windows so I am hoping it's ok to use. If I get an official request to change it or take it down I of course would.

Fontawesome is great.

I've never used it via a python package however. You can add it to your html page with one line and it loads direct from their cdn, which is much easier. Start here: https://fontawesome.com/start

Ok, I it looks like that theme is using some sort of icon 'framework' (like https://fontawesome.com/) to show icons. Each iconset / icon framework has its own specific implementation and markup for inserting icons into your page. My guess is you tried to copy the pre-existing markup for their icons and modified it for your own icon, but because the font set isn't finding an icon by the name of whatever icon you specified, its just not showing anything.

Thankfully it should be a fairly simple workaround to insert an icon the 'normal' way. SVGs are basically just XML - if you open one with a text editor you'll see what I mean. This means you can paste svg code into an html page just like any other HTML markup. So, the easiest way to do what you want to do would be to just open the svg in a text editor, and paste the markup directly into the relevant spot of your 'navigation.html' file in your _includes directory.

So first, find your 'navigation.html' file. It should be in your /_includes/ directory in your site folder. Open it up and scroll down to the line indicated with the arrow, and add the code on the black square.

https://imgur.com/ULNMgqV

Now, replace the line that says "((( SVG MARKUP GOES HERE )))" with the contents of your svg file (in other words, just open the svg file in a text editor, and inclusively copy the <svg>...</svg> tag and everything within it).

You've probably already modified this navigation.html file when you made your first attempt at adding your docker icon, so make sure and remove whatever code you added yourself before adding this code.

p.s - there's technically a simpler way to do this with an <img> </img> tag, but i was afraid that might break the CSS styling. Doing it the way i've indicated above ensures the hierarchy of tags stays the same and your CSS will still work and look as intended.

No. Per the spec:

> Generated content does not alter the document tree. In particular, it is not fed back to the document language processor (e.g., for reparsing).

Emphasis mine: this means that new elements (such as a <i> tag) won't work. You can verify that in pretty much any browser inspector.

What you should do is find the content for the desired FontAwesome icon for sort down and apply that as your content (https://fontawesome.com/icons/sort-down reports that as f0dd but you should probably just grab it direct from an inspector as that sort of thing changes with versions often enough). You'll also need to apply the same base styles to that as well. It can be tedious (and again, due to the versions unpredictable if you plan on upgrading) but that's how I've handled inserting an icon like you're trying to do.

Yo también ando dando mis primeros pasos en React, lo de agregar íconos lo resolvi usando el componente de FontAwesome https://fontawesome.com/how-to-use/on-the-web/using-with/react

The "volume-up" icon from the font awesome cheatsheet:

https://fontawesome.com/cheatsheet

I've just checked and appearantly all volume icons become a dot when I paste it, not just the volume-up one.

By icons, you mean things like this ?

for_window [class="(?i)firefox"] title_format "  %title"

Here the emoji I used is the one of Firefox

https://fontawesome.com/icons/firefox-browser

It's something I used on my machine

for_window [class="(?i)firefox"] title_format "<span size='xx-large' foreground='#FF6611'>  </span> %title"

you can play with xx-large, x-large, large

You need not edit any files. If you are using xfce4-panel too then just go to the workspace settings and change the workspace names there. For the icons, use this cheatsheet

SVG fonts are pretty slick. The def is exceptionally easy to follow and understand:

https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/SVG_fonts

Basically, very little is required outside of a name, then you <glyph>...</glyph> each path (or multiple paths, whatever).

When you want to call to it, you do so the way you normally do in every last website ever; either changing it via style tags, or, in CSS to make it clean. This is basically what Font Awesome does, just externally. I've never been much of a fan of Font Awesome, as they can, and will, take stuff away from you should you oops a licence, and I'm a fan of keeping stuff on my own servers :)

Since I programmed it with react you would have to download and install nodejs.

Then:

Clone the development Branch of my Repo
Open /src/_data/data.ts file
Here are all the URLs. You can place any URL and Font Awesome Icon in the object.
to see all the changes open a terminal (like cmd) and navigate to the project folder. Lets say tbe Folder is "C:\projects\startpage", then type "cd C:\projects\startpage" in the terminal and hit enter to get there.
type "npm i" and hit enter, this should install the npm packages which are used für the project.
type "npm start" and hit enter. The browser should open and reveal your site.
If everything looks right, type "npm run build" and hit enter. It will compile to HTML and Javascript.
You can now copy the "build" folder in the project folder and use it as startpage.

If you have any further problems or questions dont hesitate to ask!

In the case this is too complex, you could also just pm me with links and Icons from Font Awesome and I will configure and upload it for you. :)

It is a plain vanilla XFCE Panel, but using the XFCE GenMon Plugin with custom scripts to get the info (Load, RAM, Weather, etc) and the Font Awesome.

No, those are Font Awesome, but you can pretty easily modify the script to work with any icon set you want. Font Awesome has the same layout as a lot of emoji sets I think? And the Google Material Icons.

ETA: I should probably add that to the README huh.

Great work on that blueprint library!
I have 2 minor pieces of feedback though:
1. Can you upgrade the resolution for that blueprint book? It looked blurry when it showed the upgrade/destruction planner.
2. Can you use something other than "C" for the copy button? E.g. this kind of icon: https://fontawesome.com/icons/copy

Hey thanks. To answer your question, I'm using the Debutify free theme, and they have a specific section for those components. All you have to do is copy/paste the icon text from this site: https://fontawesome.com/icons?d=gallery&s=solid&m=free

Also, anything on the site you would criticize?

Looks great! I'm on the process to migrate to Homer. Couple of questions: can font size be smaller? Any good place for icons to keep similar look&feel (so far using https://fontawesome.com/icons?d=gallery) .

You don't have to extract them, you can just download it from their site from the icon show page, there's a little download SVG icon. https://fontawesome.com/icons/500px?style=brands

You can then use this handy gem to inline them from a file and still assign css classes, so you still get fingerprinting and don't have to put a bunch of raw SVG in your views. https://github.com/jamesmartin/inline_svg

I know that a lot of libraries exist with a commercial license (example https://fontawesome.com/plans). Last time I used one of these, you would download a tarball and handle it on your side later.

Right now, using multiple registries in a single project is somehow painful, it would require cli changes. But the whole community is built around the idea of free delivery of packages. I don't remember the name of a multithreading library I used in Node.js once, but it was freely downloadable and required a license key.

On the other hand, one of my competitor has a distribution model where you download the npm package as a tarball from an authenticated server.

In any case, ate the end of the day, if someone whant to put their hands on the package itself, they will be able to do so. There are only a few measures that can be taken from this. License agreement is the most straightforward.

Why finding the latest Font Awesome 5 CDN link is so hard to find?

Answer: https://fontawesome.com/account/cdn

You do need to have the icon pack installed. Else you will get the block glyph (Or some other wierd placeholder).

Also for ease of use, I use https://fontawesome.com/cheatsheet to quickly look up the icons and paste them in my configs.

You gonna have to get your UMatrix + UBlock game going. I say UBlock also because first party cookie detection. They work beautifully together.

Allow enough domains to login (Even less if you simply are browsing while signed out).

A. With FF browser and UMatrix, these domains should be blocked while allowing you to browse with no ads or background BS.

i.imgur.com (13)
imgur-com.videoplayerhub.com (1)
1. api.amplitude.com (1)
googletagmanager.com (2)

B. If you wish to login, these domains can be blocked while still allowing you to login:

cdn.coil.com (1)
apis.google.com (1)
api.amplitude.com (1)
Any domain with Google in it.

C. Once/If you log in, these domains should be blocked while allowing you to browse without any background BS.

i.imgur.com
Braze.com
Fontawesome.com
videoplayerhub.com
api.amplitude.com
googletagmanager.com

That should do it for Imgur.

Keep in mind, I also use Canvas Blocker and Font Fingerprint Defender because none of their business. Decentraleyes helps avoid Google fonts, User Agent Switcher keeps 'em guessing (Up to an extent).

Never use an app when your browser can do the same thing. It's one less app making a mockery of your/our privacy.

Always seek ways to lower your data footprint.

Good Luck.

Iconify will always spit out SVGs. Instead, sign up with FontAwesome (requires your email but it's absolutely free for what you're needing it for, that way you'll get the <link src="..."> to add FontAwesome to your code.

Once you get the cdn link and add it to your page, then wherever you want an icon just type <i class="fab fa-facebook-square"></i> (or other FontAwesome class). Then poof, it's a font and you can use all the normal text css for it.

Those logos typically come from something like Font Awesome. After including font awesome, you can look through the icons list and find the relevant icons you'd like to use, then insert them like so:

Github

Hi! Here is a code template to insert the icon next to tab names.

Navbarpage("App title", Tabpanel("Buyer Analysis", icon = icon("bar-chart-o")), .... ... ...

There are a couple websites with all the available icon you can use. Just insert the name of the icon you want in the icon= icon("....")

The website where I got these icon:- https://fontawesome.com/icons?from=io

This is a HTML function and you can easily run it in Rshiny without any additional packages

Thanks, tried this but I don't see any difference in behaviour.

Still major inconsistencies with what will or won't work.

Even most of these free icons don't seem to work

font awesome

Use these icons for the primary button. Just input the name. For example use Times it will give you a X.

I am working on modifying the page.hmtl to allow you to use any icons.

Host: Optiplex 755 Ultra Small Form Factor
OS: Debian Buster (64 bits)
DE: XFCE
WM: xfwm4
WM Theme: Numix
GTK2/ GTK3 Theme: Envi-gaps
GTK3 Theme: Numix
Icon Theme: Numix-Circle
Terminal: xterm
Terminal Theme: Nord
Terminal Font: CPMono_v07 Plain
Wallpaper: #678A9E
Weather on the CLI: https://github.com/chubin/wttr.in
Icons on the XFCE Panel: https://fontawesome.com/
Info on XFCE Panel: GenMon
No composite engine running

Chrome is blocking the font that they use for the right arrow head. Probably font awesome. Some adblockers such as ublock origin have an option to block web fonts.

OS: Xubuntu 19.10
DE: XFCE.
Fonts: Awesome for font icons.
Wallpaper: Xubuntu wallpapers.

I've spent to much time reading and jumping from distro to distro. This is my first atempt that worked out. I wanted something minimal.

https://fontawesome.com/icons/imdb?style=brands

Also, how would you share to IMDB? It isn't a social network and does not accept posts from an API of any kind

The VueJS devtools only show up on Vue apps running in development mode. Using them to determine if a site is built in Vue won't work.

I checked the source, and the following sites you listed still use Vue:

- fontawesome.com

- gitlab.com

I can't confirm Alibaba, and developer.apple.com seems to just be using jQuery.

Is this what you're looking for? https://fontawesome.com/icons/etsy

Font Awesome icons are often used for the social media icons on websites, but there's thousands of icons and they're free to use unless the website gets a lot of monthly visits.

What is Reddit's opinion of Font Awesome?
From 3.5 billion Reddit comments

➔ Font Awesome website

By popularity on Reddit, this Service is:

100 reviews of this app found across Reddit:

on head (you need to get your own cdn on fontawesome.com)

on body

icon reference

What is Reddit's opinion of Font Awesome? From 3.5 billion Reddit comments

➔ Font Awesome website

By popularity on Reddit, this Service is:

100 reviews of this app found across Reddit:

on head (you need to get your own cdn on fontawesome.com)

on body

icon reference

What is Reddit's opinion of Font Awesome?
From 3.5 billion Reddit comments