Here we will learn editor icons in google material design with examples and different type of editor icons (insert, strikethrough, text fields, title, spacebar, attach file, etc.) in google material design with examples.
Google provides different type of editor icons using material design those are format align left / right / center icons, format size, format quotes icon, insert link / photo icon, etc.
Following table shows the list of available editor icons in google material design.
Name | Usage Description | Icon | Example |
---|---|---|---|
attach file | <i class="material-icons">attach_file</i> | attach_file | DEMO |
attach money | <i class="material-icons">attach_money</i> | attach_money | DEMO |
border all | <i class="material-icons">border_all</i> | border_all | DEMO |
border bottom | <i class="material-icons">border_bottom</i> | border_bottom | DEMO |
border clear | <i class="material-icons">border_clear</i> | border_clear | DEMO |
border color | <i class="material-icons">border_color</i> | border_color | DEMO |
border horizontal | <i class="material-icons">border_horizontal</i> | border_horizontal | DEMO |
border inner | <i class="material-icons">border_inner</i> | border_inner | DEMO |
border left | <i class="material-icons">border_left</i> | border_left | DEMO |
border outer | <i class="material-icons">border_outer</i> | border_outer | DEMO |
border right | <i class="material-icons">border_right</i> | border_right | DEMO |
border style | <i class="material-icons">border_style</i> | border_style | DEMO |
border top | <i class="material-icons">border_top</i> | border_top | DEMO |
border vertical | <i class="material-icons">border_vertical</i> | border_vertical | DEMO |
bubble chart | <i class="material-icons">bubble_chart</i> | bubble_chart | DEMO |
drag handle | <i class="material-icons">drag_handle</i> | drag_handle | DEMO |
format align center | <i class="material-icons">format_align_center</i> | format_align_center | DEMO |
format align justify | <i class="material-icons">format_align_justify</i> | format_align_justify | DEMO |
format align left | <i class="material-icons">format_align_left</i> | format_align_left | DEMO |
format align right | <i class="material-icons">format_align_right</i> | format_align_right | DEMO |
format bold | <i class="material-icons">format_bold</i> | format_bold | DEMO |
format clear | <i class="material-icons">format_clear</i> | format_clear | DEMO |
format color fill | <i class="material-icons">format_color_fill</i> | format_color_fill | DEMO |
format color reset | <i class="material-icons">format_color_reset</i> | format_color_reset | DEMO |
format color text | <i class="material-icons">format_color_text</i> | format_color_text | DEMO |
format indent decrease | <i class="material-icons">format_indent_decrease</i> | format_indent_decrease | DEMO |
format indent increase | <i class="material-icons">format_indent_increase</i> | format_indent_increase | DEMO |
format italic | <i class="material-icons">format_italic</i> | format_italic | DEMO |
format line spacing | <i class="material-icons">format_line_spacing</i> | format_line_spacing | DEMO |
format list bulleted | <i class="material-icons">format_list_bulleted</i> | format_list_bulleted | DEMO |
format list numbered | <i class="material-icons">format_list_numbered</i> | format_list_numbered | DEMO |
format paint | <i class="material-icons">format_paint</i> | format_paint | DEMO |
format quote | <i class="material-icons">format_quote</i> | format_quote | DEMO |
format shapes | <i class="material-icons">format_shapes</i> | format_shapes | DEMO |
format size | <i class="material-icons">format_size</i> | format_size | DEMO |
format strikethrough | <i class="material-icons">format_strikethrough</i> | format_strikethrough | DEMO |
format textdirection l to r | <i class="material-icons">format_textdirection_l_to_r</i> | format_textdirection_l_to_r | DEMO |
format textdirection r to l | <i class="material-icons">format_textdirection_r_to_l</i> | format_textdirection_r_to_l | DEMO |
format underlined | <i class="material-icons">format_underlined</i> | format_underlined | DEMO |
functions | <i class="material-icons">functions</i> | functions | DEMO |
highlight | <i class="material-icons">highlight</i> | highlight | DEMO |
insert chart | <i class="material-icons">insert_chart</i> | insert_chart | DEMO |
insert comment | <i class="material-icons">insert_comment</i> | insert_comment | DEMO |
insert drive file | <i class="material-icons">insert_drive_file</i> | insert_drive_file | DEMO |
insert emoticon | <i class="material-icons">insert_emoticon</i> | insert_emoticon | DEMO |
insert invitation | <i class="material-icons">insert_invitation</i> | insert_invitation | DEMO |
insert link | <i class="material-icons">insert_link</i> | insert_link | DEMO |
insert photo | <i class="material-icons">insert_photo</i> | insert_photo | DEMO |
linear scale | <i class="material-icons">linear_scale</i> | linear_scale | DEMO |
merge type | <i class="material-icons">merge_type</i> | merge_type | DEMO |
mode comment | <i class="material-icons">mode_comment</i> | mode_comment | DEMO |
mode edit | <i class="material-icons">mode_edit</i> | mode_edit | DEMO |
monetization on | <i class="material-icons">monetization_on</i> | monetization_on | DEMO |
money off | <i class="material-icons">money_off</i> | money_off | DEMO |
multiline chart | <i class="material-icons">multiline_chart</i> | multiline_chart | DEMO |
pie chart | <i class="material-icons">pie_chart</i> | pie_chart | DEMO |
pie chart outlined | <i class="material-icons">pie_chart_outlined</i> | pie_chart_outlined | DEMO |
publish | <i class="material-icons">publish</i> | publish | DEMO |
short text | <i class="material-icons">short_text</i> | short_text | DEMO |
show chart | <i class="material-icons">show_chart</i> | show_chart | DEMO |
space bar | <i class="material-icons">space_bar</i> | space_bar | DEMO |
strikethrough s | <i class="material-icons">strikethrough_s</i> | strikethrough_s | DEMO |
text fields | <i class="material-icons">text_fields</i> | text_fields | DEMO |
title | <i class="material-icons">title</i> | title | DEMO |
vertical align bottom | <i class="material-icons">vertical_align_bottom</i> | vertical_align_bottom | DEMO |
vertical align center | <i class="material-icons">vertical_align_center</i> | vertical_align_center | DEMO |
vertical align top | <i class="material-icons">vertical_align_top</i> | vertical_align_top | DEMO |
wrap text | <i class="material-icons">wrap_text</i> | wrap_text | DEMO |