Material Design Icons

Tech  Material Design Icons

Material Design Icons
3d_rotation accessibility account_balance account_balance_wallet account_box account_child account_circle add add_box add_circle add_circle_outline add_shopping_cart alarm alarm_add alarm_off alarm_on android announcement apps archive arrow_back arrow_drop_down arrow_drop_down_circle arrow_drop_up arrow_forward aspect_ratio assessment assignment assignment_ind assignment_late assignment_return assignment_returned assignment_turned_in attachment autorenew backspace backup block book bookmark bookmark_outline bug_report cached cancel check check_box check_box_outline_blank check_circle chevron_left chevron_right class clear close cloud cloud_circle cloud_done cloud_download cloud_off cloud_queue cloud_upload content_copy content_cut content_paste create credit_card dashboard delete description dns done done_all drafts error event exit_to_app expand_less expand_more explore extension face favorite favorite_outline file_download file_upload filter_list find_in_page find_replace flag flip_to_back flip_to_front folder folder_open folder_shared forward fullscreen fullscreen_exit gesture get_app grade group_work help highlight_remove history home https inbox info info_outline input invert_colors ios label label_outline language launch link list lock lock_open lock_outline loyalty mail markunread markunread_mailbox menu more_horiz more_vert note_add open_in_browser open_in_new open_with pageview payment perm_camera_mic perm_contact_cal perm_data_setting perm_device_info perm_identity perm_media perm_phone_msg perm_scan_wifi picture_in_picture polymer print query_builder question_answer radio_button_off radio_button_on receipt redeem redo refresh remove remove_circle remove_circle_outline reorder reply reply_all report report_problem restore room save schedule search select_all send settings settings_applications settings_backup_restore settings_bluetooth settings_cell settings_display settings_ethernet settings_input_antenna settings_input_component settings_input_composite settings_input_hdmi settings_input_svideo settings_overscan settings_phone settings_power settings_remote settings_voice shop shop_two shopping_basket shopping_cart sort speaker_notes spellcheck star star_half star_outline star_rate stars store subject supervisor_account swap_horiz swap_vert swap_vert_circle system_update_tv tab tab_unselected text_format theaters thumb_down thumb_up thumbs_up_down toc today track_changes translate trending_down trending_neutral trending_up turned_in turned_in_not undo unfold_less unfold_more verified_user view_agenda view_array view_carousel view_column view_day view_headline view_list view_module view_quilt view_stream view_week visibility visibility_off wallet_giftcard wallet_membership wallet_travel warning web work
What is a Material icon ? - Material icons are beautifully crafted, delightful, and easy to use in your web, Android, and iOS projects. Learn more about material design and our process for making these icons in the system icons section of the material design guidelines.
How to use the Icon? Icon Font - The best way to use these icons on the web is with our icon web font. It's lightweight, easy to use, and hosted by Google Web Fonts. Learn how to use font-based icons in our developer guide.
Fit for Use - A variety of sizes and densities can be downloaded from this site. Our icon set is also available as a git repository, making it even easier for developers to customize, share, and re-use.
Open Source - Feel free to use, remix, and re-share the icons in your products. The icons are available under the CC-BY license. We'd love attribution in your app's "about" screen, but it's not required. The only thing we ask is that you not re-sell the icons.
Categories : Action, Alert, AV, Communication, Content, Device, Editor, File, Hardware, Image, Maps, Navigation, Notification, Social, Toggle
Examples
folder folder + circle
face face md-48 48px - By number : #E87C - face face md-dark md-inactive - face orange - face face md-light
3d_rotation 3d_rotation
accessibility accessibility
account_balance account_balance
account_balance_wallet account_balance_wallet
account_box account_box
account_child account_child
account_circle account_circle
add-box add-box
add-circle-outline add-circle-outline
add-circle add-circle
add-shopping-cart add-shopping-cart
add add
add_shopping_cart add_shopping_cart
alarm alarm
alarm_add alarm_add
alarm_off alarm_off
alarm_on alarm_on
android android
announcement announcement
apps apps
archive archive
arrow_back arrow_back
arrow_drop_down arrow_drop_down
arrow_drop_down_circle arrow_drop_down_circle
arrow_drop_up arrow_drop_up
arrow_forward arrow_forward
aspect_ratio aspect_ratio
aspect_ratio aspect_ratio
assessment assessment
assignment assignment
assignment_ind assignment_ind
assignment_ind assignment_ind
assignment_late assignment_late
assignment_late assignment_late
assignment_return assignment_return
assignment_return assignment_return
assignment_returned assignment_returned
assignment_returned assignment_returned
assignment_turned_in assignment_turned_in
assignment_turned_in assignment_turned_in
attachment attachment
autorenew backup autorenew backup
autorenew autorenew
backspace backspace
backup backup
bell bell
block block
book book
bookmark bookmark
bookmark_border bookmark_border
bookmark_outline bookmark_outline
bug_report bug_report
bug_report bug_report
build build
cached cached
camera_enhance camera_enhance
cancel cancel
car car
card_giftcard card_giftcard
card_membership card_membership
card_travel card_travel
change_history change_history
check check
check_box check_box
check_box_outline_blank check_box_outline_blank
check_circle check_circle
check_circle check_circle
chevron_left chevron_left
chevron_right chevron_right
chrome_reader_mode chrome_reader_mode
class class
clear clear
close close
cloud cloud
cloud_circle cloud_circle
cloud_done cloud_done
cloud_download cloud_download
cloud_off cloud_off
cloud_queue cloud_queue
cloud_upload cloud_upload
code code
content_copy content_copy
content_cut content_cut
content_paste content_paste
create create
credit_card credit_card
credit_card credit_card
dashboard dashboard
delete delete
description description
dns dns
done done
done_all done_all
drafts drafts
eject eject
error error
event event
event_seat event_seat
exit_to_app exit_to_app
exit_to_app exit_to_app
expand_less expand_less
expand_more expand_more
explore explore
extension extension
face face
face face
favorite favorite
favorite_border favorite_border
favorite_outline favorite_outline
feedback feedback
file_download file_download
file_upload file_upload
filter_list filter_list
find_in_page find_in_page
find_in_page find_in_page
find_replace find_replace
find_replace find_replace
flag flag
flight_land flight_land
flight_takeoff flight_takeoff
flip_to_back flip_to_back
flip_to_front flip_to_front
folder folder
folder folder
folder_open folder_open
folder_shared folder_shared
forward forward
fullscreen fullscreen
fullscreen_exit fullscreen_exit
gesture gesture
get_app get_app
gif gif
grade grade
group_add group_add
group_work group_work
group_work group_work
help help
help_outline help_outline
highlight_off highlight_off
highlight_remove highlight_remove
history history
home home
hourglass_empty hourglass_empty
hourglass_full hourglass_full
http http
https https
ic_account_balance ic_account_balance
inbox inbox
info info
info_outline info_outline
info_outline info_outline
input input
invert_colors invert_colors
invert_colors invert_colors
ios ios
label label
label_outline label_outline
label_outline label_outline
language language
launch launch
link link
list list
lock lock
lock_open lock_open
lock_outline lock_outline
lock_outline lock_outline
loyalty loyalty
mail mail
markunread markunread
markunread_mailbox markunread_mailbox
markunread_mailbox markunread_mailbox
menu menu
more_horiz more_horiz
more_vert more_vert
note_add note_add
offline_pin offline_pin
open_in_browser open_in_browser
open_in_browser open_in_browser
open_in_new open_in_new
open_in_new open_in_new
open_with open_with
open_with open_with
pageview pageview
payment payment
perm_camera_mic perm_camera_mic
perm_camera_mic perm_camera_mic
perm_contact_cal perm_contact_cal
perm_contact_calendar perm_contact_calendar
perm_data_setting perm_data_setting
perm_data_setting perm_data_setting
perm_device_info perm_device_info
perm_device_information perm_device_information
perm_identity perm_identity
perm_identity perm_identity
perm_media perm_media
perm_media perm_media
perm_phone_msg perm_phone_msg
perm_phone_msg perm_phone_msg
perm_scan_wifi perm_scan_wifi
perm_scan_wifi perm_scan_wifi
picture_in_picture picture_in_picture
picture_in_picture picture_in_picture
play_for_work play_for_work
polymer polymer
power_settings_new power_settings_new
print print
query_builder query_builder
query_builder query_builder
question_answer question_answer
question_answer question_answer
radio_button_off radio_button_off
radio_button_on radio_button_on
receipt receipt
redeem redeem
redo redo
refresh refresh
remove remove
remove_circle remove_circle
remove_circle_outline remove_circle_outline
reorder reorder
reply reply
reply_all reply_all
report report
report_problem report_problem
report_problem report_problem
restore restore
room room
save save
schedule schedule
search search
select_all select_all
send send
settings settings
settings_applications settings_applications
settings_applications settings_applications
settings_backup_restore settings_backup_restore
settings_backup_restore settings_backup_restore
settings_bluetooth settings_bluetooth
settings_bluetooth settings_bluetooth
settings_brightness settings_brightness
settings_cell settings_cell
settings_cell settings_cell
settings_display settings_display
settings_ethernet settings_ethernet
settings_ethernet settings_ethernet
settings_input_antenna settings_input_antenna
settings_input_antenna settings_input_antenna
settings_input_component settings_input_component
settings_input_component settings_input_component
settings_input_composite settings_input_composite
settings_input_composite settings_input_composite
settings_input_hdmi settings_input_hdmi
settings_input_hdmi settings_input_hdmi
settings_input_svideo settings_input_svideo
settings_input_svideo settings_input_svideo
settings_overscan settings_overscan
settings_overscan settings_overscan
settings_phone settings_phone
settings_phone settings_phone
settings_power settings_power
settings_power settings_power
settings_remote settings_remote
settings_remote settings_remote
settings_voice settings_voice
settings_voice settings_voice
shop shop
shop_two shop_two
shop_two shop_two
shopping_basket shopping_basket
shopping_basket shopping_basket
shopping_cart shopping_cart
shopping_cart shopping_cart
sort sort
speaker_notes speaker_notes
speaker_notes speaker_notes
spellcheck spellcheck
star star
star_half star_half
star_outline star_outline
star_rate star_rate
star_rate star_rate
stars stars
store store
subject subject
supervisor_account supervisor_account
supervisor_account supervisor_account
swap_horiz swap_horiz
swap_horiz swap_horiz
swap_vert swap_vert
swap_vert swap_vert
swap_vert_circle swap_vert_circle
swap_vertical_circle swap_vertical_circle
system_update_alt system_update_alt
system_update_tv system_update_tv
tab tab
tab tab
tab_unselected tab_unselected
tab_unselected tab_unselected
text_format text_format
theaters theaters
thumb_down thumb_down
thumb_up thumb_up
thumbs_up_down thumbs_up_down
toc toc
today today
toll toll
track_changes track_changes
translate translate
trending_down trending_down
trending_down trending_down
trending_neutral trending_neutral
trending_up trending_up
turned_in turned_in
turned_in_not turned_in_not
undo undo
unfold_less unfold_less
unfold_more unfold_more
verified_user verified_user
view_agenda view_agenda
view_array view_array
view_carousel view_carousel
view_column view_column
view_day view_day
view_headline view_headline
view_list view_list
view_module view_module
view_quilt view_quilt
view_stream view_stream
view_week view_week
visibility visibility
visibility_off visibility_off
wallet_giftcard wallet_giftcard
wallet_membership wallet_membership
wallet_travel wallet_travel
warning warning
web web
work work
Examples: face face // Rules for sizing the icon. .material-icons.md-18 { font-size: 18px; } .material-icons.md-24 { font-size: 24px; } .material-icons.md-36 { font-size: 36px; } .material-icons.md-48 { font-size: 48px; } // Rules for using icons as black on a light background. .material-icons.md-dark { color: rgba(0, 0, 0, 0.54); } .material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); } // Rules for using icons as white on a dark background. .material-icons.md-light { color: rgba(255, 255, 255, 1); } .material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }
ICON FONT - STEP 1: Setup Icon Font - Follow the instructions to embed the icon font in your site and learn how to style your icons using CSS. STEP 2: Use Icon in Your Site account_balance Account Balance - PNGS SVG 24dp 18dp 36dp 48dp
Documentation
Material Icons IO
Material Design Icons Github
Design Icons From Material Design icons by Google
Material Design Icons Web Site
Style Icons Design Spec
Material Blue - MaxCDN
Bootstrap material design icons Bootstrap
mdi mdi-format-align-left
More Icons
Material Design Icons Tech 2017