Font-awesome: Icon Request: fa-char-<letter>

[LCastr0]

It would be very cool if there was 1 icon to each alphabet letter (A, B, C...) and number.

[tagliala]

hi @LCastr0 ,

please keep in mind that you are requesting at least 58 new icons that will also bloat the css file.

The request is legit, but usally standard unicode points and huge requests have very low priority.

You can obtain this with plain css.

Please take a look here: http://jsfiddle.net/tagliala/77re29ct/24/

[KOTRET]

this is not a valid request, this has to be done in CSS or with a seperate font and does NOT belong to icons.

[tagliala]

@KOTRET as copyright, dollar, euro & many other standard unicode points that were implemented to keep the same look & feel with icons.

Sure having copyright is much easier than having the whole latin (or greek #2828) alphabet. Or digits too #2158

To be honest, I shutted down this one about numbers: #3597

But you are right and it is also legit to point out that (AFAWK, maybe Dave has something different in mind) turning fontawesome in a font is not the main target of this project

[erm3nda]

If i do undestand correctly, use a fortawesome icon can avoid me to get an image, use the tag, put with css then finally, show it. Why is not that good for numbers too?

I don't know how hard can be to add 10 (0-9) more icons wich are used for general purpose.
So, what about Roman numbers? There are less and got some ornamental design...

Even if i don't know what will be a good solution, i don't think is cool to avoid number icons on the icon pack.

[tagliala]

Why is not that good for numbers too?

Because numbers are already present in almost all fonts and fontawesome is basically a font. With numbers (and standard unicode point), we will overload css with dozens of class definitions (icon-number-0..icon-number-9, icon-letter-A..icon-letter-Z, icon-letter-a..icon-letter-z, icon-letter-greek-a..icon-letter-greek-omega)

If you want to add numbers, you could use thie following approach: http://jsfiddle.net/tagliala/77re29ct/61/

You could also use the stack feature: http://blog.fontawesome.io/2014/05/19/stacking-text-and-icons/

Moreover, the suggested use case for numbers is often an abuse that goes beyond the meaning of icon (e.g.: numbers from 1 to 100 inside a table, grades (A-F). Why that? Use a number/letters so you can also sort the rows)

So, what about Roman numbers? There are less and got some ornamental design...

I wouldn't say they are less romam numbers... If we only implement I,V,X,L,C,D and M, in order to write 4 we should use two icons: icon-number-1-roman icon-number-5-roman which is counterintuitive. Same for almost any other roman number.

Should Dave implement all roman numbers between 1 and ∞?

Said that, it would be useful to have numbers and letters in fontawesome which have the same aspect of other icons, but this is not the priority at the moment

[erm3nda]

Thank you, i used stacked from http://stackoverflow.com/a/24264565/2480481 but with a modify to use numbers: <span class="fa-stack fa-lg"> <i class="fa fa-circle-thin fa-stack-2x"></i> <i class="fa fa-stack-1x">1</i> </span> as example. Doing that no need about font-face on the number.

[erm3nda]

I wouldn't say they are less romam numbers... If we only implement I,V,X,L,C,D and M, in order to write 4 we should use two icons: icon-number-1-roman icon-number-5-roman which is counterintuitive. Same for almost any other roman number.

Same as you wrote two words when writting IV with keyboard you must use 2 icons for put the number with icons. If that is counterintuitive for you i have no idea how can it be. Same goes for decimal numbers. To put twenty three you must write 23, and the same goes for the number of icons involved.

I say just develop 0-9 digits then use/combine. Also a special class for "join" numbers with a 75% widht can be cool.

Anyway stacked is cool enough for me ;)

Thank you again.

[tagliala]

ok got it. you would write roman numbers in this way icon-letter-i icon-letter-v rather than icon-number-roman-1 icon-number-roman-1

So roman numbers are a subset of icon-letter-a..icon-letter-z

[erm3nda]

Yes, you got it. Decimal system can be done with a subset of numbers 0-9 and Roman too with a subset of letters IVXLCDM.

In both cases, using stacking you are done.

[erm3nda]

Funny note: Infinite ∞ is not a number and is not represented by one of them.
It's a term and it's represented by an simbol. You don't need to reach it, also i guess you would need ∞ RAM to go for :)

[ghost]

+1, But it should be "fa-sign-{letter}"

[nostalgiaz]

+1

[Crolug]

+1, especially for Roman

[chillinski]

What about adding a modifier class (like fa-letter) that will style the text-content of the HTML-tag it is assigned to. So you do not need to create new CSS classes for each requested character/letter.

[samayo]

+1

[cykerway]

+1

[tagliala]

I'm going to close this one for the moment.

Please use custom css if you really need letters

[TheBuky]

+1

Too bad, if i need capital letter with good font i only can found A there <i class="fa fa-font" aria-hidden="true"></i> But i can find 11 differents of thermometer and 11 versions of battery...

Alphabet in capital letter have 26 letters, in other way thermometer + battery have 22 icons....

[tagliala]

Hi,

thermometer + battery have 22 icons....

10 icons (5 + 5), the other ones are aliases

[Ujjwal-9]

.fa-font:before {
        font-family: roboto;
        color: #429bf4;
        font-size: 1.2em;
        content: "k";   #any letter of your choice
}

Add above code to the style tag.
This gives same functionality as other Font-Awesome icon and it can be used like this:

<i class="fa fa-font"></i>

[My1]

I think numbers wouldnt be too bad, either or other chars, but one thing: I dont think this would need crazy CSS, because letters and numbers are precisely that. no need to put some before statements in, one could just do <i class="fas">2</i> and the font would do the rest.

[exodus4d]

You can even make the "char" icon dynamic:

<i class="fas pf-char fa-fw" data-char-content="S"></i>

and CSS:

.pf-char:before{
    font-family: Arial; /* your font family here! */
    font-weight: bold;
    content: attr(data-char-content);
}

[gerardreches]

please keep in mind that you are requesting at least 58 new icons that will also bloat the css file.

I think this shouldn't be a big issue since FontAwesome 5 and kits loading only the used icons.

I'm using the Elementor plugin in WordPress, which uses FontAwesome for its icons and has compatibility with FontAwesome Pro, and I find myself needing these icons. Unfortunately, in some situations, it's not easy or possible to use custom HTML/CSS, and these icons might be required.