• This repository has been archived on 03/Jan/2019
  • Stars
    star
    100
  • Rank 338,857 (Top 7 %)
  • Language
    HTML
  • Created about 8 years ago
  • Updated over 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

The iconic font and CSS toolkit

I have archived this repo as Font Awesome comes with SVGs now

Font Awesome SVGs

Doing a lot of prototyping in the past, having Font Awesome as part of my front end starter files was always really handy for quickly adding icons when I was building a UI.

Nowadays we are more aware that using a font to represent icons isn’t necessarily the most accessible thing to do for everyone, as Serend explains here.

So as I’m whipping up a website right at this moment I thought it a good opportunity to take the first steps to swap out the font for svgs. So…

Here’s a repo with font awesome icons as svgs

I forked the Font Awesome repo so I can keep it as up to date with the original as I can.

I added an SVG folder to add all the generated glyphs to.

I used font blast to generate SVGs from a font, a la Sara Soueidan mentions in her blog post here.

To include the SVG’s I used the CSS Inline SVG Sprites method, again described by Sara here. It seemed the easiest to integrate with the set up I already had, as I was using classes to add icons to elements.

The most long winded part was making sure I had all the correct icons - I think a good addition to this repo would be a generated spite sheet with stylesheet companion and easy reference classes. I’ve opened an issue 😎

———————————————

All Font Awesome licensing etc… still applies. Info etc… is in the origin readme here

More Repositories

1

Talk-Web-Audio

Web Audio API Talk
JavaScript
43
star
2

browserapis.wtf

Web site categorising all the web/browser apis - most importantly uses for them - but also their code, resources, w3c status and other links.
JavaScript
34
star
3

VJing

First VJing repo
HTML
15
star
4

Pocket-Kitten

A simple Firefox OS app for Gaia
JavaScript
8
star
5

Talk-Be-AV-Artist

How To Be A Web A/V Artist Talk
JavaScript
8
star
6

audioVisStarter

Audio Vis Starter Kit for nodeart workshop
JavaScript
7
star
7

Talk-Web-Workers

A talk about web workers, the what & how, with a focus on workers in specs, like audio worklet, offline canvas and CSS Paint API among others
CSS
6
star
8

My-RSS-Feeds

Some scripts for converting JSON outputs to RSS feeds for use with IFTTT
PHP
4
star
9

Vizra

A set of libraries to generatively create canvas shapes: Still in version 0.000001
HTML
4
star
10

MIDI-demos

A set of cool interactive thangs to demonstrate the awesome power of Web MIDI
JavaScript
4
star
11

simpleMetalsmithBoilerplate

Simple Metalsmith starter boilerplate - no frills (no partials etc...) but does include sass
JavaScript
4
star
12

dancing

Demos for my 24 Ways article
HTML
4
star
13

Rubies

An interactive music powered installation piece, originally developed for Bath Ruby
HTML
4
star
14

web-audio-workshops

Repo for my Web Audio Workshops
HTML
3
star
15

JSeverywhere

Javascript is everywhere talk
HTML
3
star
16

sharedMods

Shared modules
JavaScript
2
star
17

VJ-Tracks

Separating from VJ software so I can play within an isolated environment
HTML
2
star
18

Party-Talk

Let's start a party (this may NOT work fyi)
HTML
2
star
19

make-your-browser-dance

Make your browser dance talk (reveal.js)
JavaScript
2
star
20

studio

Collating all my small demos into one place
HTML
2
star
21

interactive-wall

An interactive art wall concept. Paint on it with your mobile phone.
JavaScript
2
star
22

bookofshaders

Just the glsl files I wrote whilst doing the Book Of Shaders
GLSL
2
star
23

MIDI-Talk

Talk all about MIDI and web apis
HTML
2
star
24

demo-boilerplate

Node boilerplate for demos/pocs
HTML
1
star
25

webWorkers

Repo for messing with web workers
JavaScript
1
star
26

HTML_CSS_Basics

HTML & CSS Basics course
1
star
27

lasilda

Software to control lasers!
HTML
1
star
28

rumyra

Landing page for rumyra.com
SCSS
1
star
29

dolby

Visual app for Dolby competition
HTML
1
star
30

controlling-video

Demo to control video on my laptop from my phone
1
star
31

soundForm

Form validation with added sound
HTML
1
star
32

dating-numbers

Dating is a game of numbers
JavaScript
1
star
33

VizModules

Module that returns a map for grid coordinates, based on different settings
JavaScript
1
star
34

emotions

How am I feeling at a certain time and place
JavaScript
1
star
35

live-js

Ruth & Tim's Live JS Talk
HTML
1
star
36

evangelistbackpacks

Need a backpack? So do we, mostly for travelling, so we reviewed some...
1
star
37

EspruinoScreenWorkshop

Worksheet and files for Espruino workshop '16
JavaScript
1
star
38

i-am-naked

*I am Naked* is an HTML5 barebones Wordpress theme. This time with no CSS already written so you can create your very own. This theme concentrates on beautiful clean simple HTML5 markup - no extra divs & purely semantic elements.
PHP
1
star
39

Talk-to-me

Proof of Concept: Web app for reading text.
CSS
1
star