AndroidCSS

Android material design Programming Blog

CSS Shapes and Icons Generator

CSS/CSS3 shapes and icons generator make use of single html element to generate icon. Change the color and size of icon as you need.

The html part of each icon in CSS icon generator contains single <i> element and it’s styled from CSS by using CSS pseudo elements. Click on below shapes and icons to get code.

Share:

BACKGROUND

COLOR

SIZE

GET CODE

CSS Shapes

circle
square
rectangle
triangle up
triangle right
triangle down
triangle left
triangle top left
triangle top right
triangle bottom right
triangle bottom left
oval horizontal
oval vertical
trapezoid
diamond square
cone
parallelogram 1
parallelogram 2
rectangle rounded edge
pentagon
diamond shield
diamond cut
base
hexagon
octagon
8 point burst
12 point burst
TV screen
star
drum narrow

CSS Icons

plus
plus circle outline
plus square outline
plus circle filled
plus square filled
minus
minus circle outline
minus square outline
minus circle filled
minus square filled
cross
cross circle outline
cross square outline
cross circle filled
cross square filled
k-arrow left
k-arrow left circle outline
k-arrow left square outline
k-arrow left circle filled
k-arrow left square filled
k-arrow right
k-arrow right circle outline
k-arrow right square outline
k-arrow right circle filled
k-arrow right square filled
k-arrow up
k-arrow up circle outline
k-arrow up square outline
k-arrow up circle filled
k-arrow up square filled
k-arrow down
k-arrow down circle outline
k-arrow down square outline
k-arrow down circle filled
k-arrow down square filled
arrow right
arrow right circle outline
arrow right square outline
arrow right circle filled
arrow right square filled
arrow left
arrow left circle outline
arrow left square outline
arrow left circle filled
sarrow left quare filled
arrow up
arrow up circle outline
arrow up square outline
arrow up circle filled
arrow up square filled
arrow down
arrow down circle outline
arrow down square outline
arrow down circle filled
arrow down square filled
arrow backward
carrow backward circle outline
arrow backward square outline
arrow backward circle filled
arrow backward square filled
arrow forward
arrow forward circle outline
arrow forward square outline
arrow forward circle filled
arrow forward square filled
arrow upward
arrow upward circle outline
arrow upward square outline
arrow upward circle filled
arrow upward square filled
arrow downward
arrow downward circle outline
arrow downward square outline
arrow downward circle filled
arrow downward square filled
arrow drop left
arrow drop left circle outline
arrow drop left square outline
arrow drop left circle filled
arrow drop left square filled
arrow drop right
arrow drop right circle outline
arrow drop right square outline
arrow drop right circle filled
arrow drop right square filled
arrow drop up
arrow drop up circle outline
arrow drop up square outline
arrow drop up circle filled
arrow drop up square filled
arrow drop down
arrow drop down circle outline
arrow drop down square outline
arrow drop down circle filled
arrow drop down square filled
pause
pause circle outline
pause square outline
pause circle filled
pause square filled
check
check circle outline
check square outline
check circle filled
check square filled
error
error circle outline
error square outline
error circle filled
error square filled
info
info circle outline
info square outline
info circle filled
info square filled
banned
adjust
menu
bookmark
caution
radio button uncheck
radio button check
3 dots horizontal
3 dots vertical
first page
last page
first page filled
last page filled
download
publish
Retry
wifi
user
user circle outline
user square outline
user circle filled
user square filled
camera
calender
clock outline
clock filled
Refresh
credit card
computer
shut down
home
locked
lock opened
No lock
magnifier
location
music
cd player
hour glass
no sound
sound
copyright
heart

More Icons…Coming Soon…


About | Policy | Disclaimer

Creative Commons LicenceUp ↑