Sprite Generator
Icons by: Feather Icons
The sprite
The PNG Image:
The JPG Image:
Click "icons" to add to the sprite
Core
activity
airplay
alert-circle
alert-octagon
alert-triangle
align-center
align-justify
align-left
align-right
anchor
at-sign
award
bar-chart-2
bar-chart
battery-charging
battery
bell-off
bell
bluetooth
book
bookmark
box
briefcase
calendar
cast
check-circle
check-square
check
circle
clipboard
clock
cloud-off
cloud
command
copy
cpu
delete
disc
download-cloud
download
edit-2
edit-3
edit
external-link
eye-off
eye
feather
file
filter
flag
folder
grid
hash
headphones
heart
home
inbox
info
layers
layout
life-buoy
link-2
link
list
loader
lock
log-in
log-out
maximize-2
maximize
menu
mic-off
mic
minimize-2
minimize
minus-circle
minus-square
minus
monitor
more-horizontal
more-vertical
move
music
octagon
package
pie-chart
plus-circle
plus-square
plus
power
printer
radio
refresh-ccw
refresh-cw
rotate-ccw
rotate-cw
scissors
search
settings
share-2
share
slash
speaker
square
star
tag
target
thumbs-down
thumbs-up
toggle-left
toggle-right
trash-2
trash
trending-down
trending-up
triangle
type
unlock
upload-cloud
upload
user-check
user-minus
user-plus
user-x
user
watch
wifi
x-circle
x-square
x
zap
zoom-in
zoom-out
Media Controls
fast-forward
pause
play
repeat
rewind
shuffle
skip-back
skip-forward
volume-1
volume-2
volume-x
volume
Communication
message-circle
message-square
phone-call
phone-forwarded
phone-incoming
phone-missed
phone-off
phone-outgoing
phone
voicemail
Photo and Video
aperture
camera-off
camera
image
video-off
video
Location
compass
crosshair
globe
map-pin
map
navigation-2
navigation
Weather
cloud-drizzle
cloud-lightning
cloud-rain
cloud-snow
droplet
moon
sun
sunrise
sunset
thermometer
umbrella
wind
Arrows
arrow-down-left
arrow-down-right
arrow-down
arrow-left
arrow-right
arrow-up-left
arrow-up-right
arrow-up
chevron-down
chevron-left
chevron-right
chevron-up
chevrons-down
chevrons-left
chevrons-right
chevrons-up
Logos
chrome
codepen
github
slack
Here's the CSS
Replace *** with png or jpg
Instructions
The PNG version shown has a transparent background
The JPG version shown has a white background
To make the icon smaller add: zoom:0.60; -moz-transform:scale(0.60); -moz-transform-origin: 0 0;
To make the icon bigger add: zoom:1.40; -moz-transform:scale(1.40); -moz-transform-origin: 0 0;
To use this in your html you can just add it as a class like this:
<span class="sprite-thumbs-up"></span>