Icon Libraries

Font icons

A font icon is a graphic symbol or glyph that is created using font characters. Font icons are typically created using scalable vector graphics (SVGs) and are used as a font rather than an image. As a SVG character, the font icons can be easily resized and styled using CSS, and can also be loaded more efficiently than traditional image icons. Font icons are commonly used in web design to provide simple and scalable icons for buttons, navigation bars, symbols, and other user interface elements. They are often used in conjunction with web fonts, which are a collection of font files that can be loaded onto a web page and used to display text in a particular typeface. Some popular font icon libraries include Font Awesome, Material Design Icons, and Ionicons. These libraries provide a wide range of icons that can be easily integrated into a web project, and are typically free to use under an open source license.

Practical Notes

Icon Implementation Checklist

Icons work best when they support quick recognition without becoming the only way a user understands an action.

Label important controls

Use visible text or accessible labels for buttons where the icon meaning may be ambiguous.

Keep style consistent

Mixing filled, outlined, sharp, and rounded icon families can make an interface feel uneven.

Load only what you need

Large icon fonts can cost performance. SVG sprites or subset fonts are better for focused interfaces.

Align Space Even

Class: align_space_even
Category: text_formatting
Code Point: f788

Align Start

Class: align_start
Category: text_formatting
Code Point: f787

Align Stretch

Class: align_stretch
Category: text_formatting
Code Point: f786

Align Vertical Bottom

Class: align_vertical_bottom
Category: text_formatting
Code Point: e015

Align Vertical Center

Class: align_vertical_center
Category: text_formatting
Code Point: e011

Align Vertical Top

Class: align_vertical_top
Category: text_formatting
Code Point: e00c

Amp Stories

Class: amp_stories
Category: text_formatting
Code Point: ea13

Article

Class: article
Category: text_formatting
Code Point: ef42

Assignment

Class: assignment
Category: text_formatting
Code Point: e85d

Assignment Add

Class: assignment_add
Category: text_formatting
Code Point: f848

Assignment Ind

Class: assignment_ind
Category: text_formatting
Code Point: e85e

Assignment Late

Class: assignment_late
Category: text_formatting
Code Point: e85f

Assignment Return

Class: assignment_return
Category: text_formatting
Code Point: e860

Assignment Returned

Class: assignment_returned
Category: text_formatting
Code Point: e861

Assignment Turned In

Class: assignment_turned_in
Category: text_formatting
Code Point: e862

Attach File

Class: attach_file
Category: text_formatting
Code Point: e226

Attach File Add

Class: attach_file_add
Category: text_formatting
Code Point: f841

Attachment

Class: attachment
Category: text_formatting
Code Point: e2bc

Ballot

Class: ballot
Category: text_formatting
Code Point: e172

Book

Class: book
Category: text_formatting
Code Point: e865

Border All

Class: border_all
Category: text_formatting
Code Point: e228

Border Bottom

Class: border_bottom
Category: text_formatting
Code Point: e229

Border Clear

Class: border_clear
Category: text_formatting
Code Point: e22a

Border Color

Class: border_color
Category: text_formatting
Code Point: e22b

Border Horizontal

Class: border_horizontal
Category: text_formatting
Code Point: e22c

Border Inner

Class: border_inner
Category: text_formatting
Code Point: e22d

Border Left

Class: border_left
Category: text_formatting
Code Point: e22e

Border Outer

Class: border_outer
Category: text_formatting
Code Point: e22f

Border Right

Class: border_right
Category: text_formatting
Code Point: e230

Border Style

Class: border_style
Category: text_formatting
Code Point: e231

Border Top

Class: border_top
Category: text_formatting
Code Point: e232

Border Vertical

Class: border_vertical
Category: text_formatting
Code Point: e233

Breaking News Alt 1

Class: breaking_news_alt_1
Category: text_formatting
Code Point: f0ba

Business Chip

Class: business_chip
Category: text_formatting
Code Point: f84c

Calendar View Day

Class: calendar_view_day
Category: text_formatting
Code Point: e936

Calendar View Month

Class: calendar_view_month
Category: text_formatting
Code Point: efe7

Calendar View Week

Class: calendar_view_week
Category: text_formatting
Code Point: efe8

Cell Merge

Class: cell_merge
Category: text_formatting
Code Point: f82e

Checklist

Class: checklist
Category: text_formatting
Code Point: e6b1

Checklist Rtl

Class: checklist_rtl
Category: text_formatting
Code Point: e6b3

Clarify

Class: clarify
Category: text_formatting
Code Point: f0bf

Cloud

Class: cloud
Category: text_formatting
Code Point: e2bd

Cloud Circle

Class: cloud_circle
Category: text_formatting
Code Point: e2be

Cloud Done

Class: cloud_done
Category: text_formatting
Code Point: e2bf

Cloud Download

Class: cloud_download
Category: text_formatting
Code Point: e2c0

Cloud Off

Class: cloud_off
Category: text_formatting
Code Point: e2c1

Cloud Queue

Class: cloud_queue
Category: text_formatting
Code Point: e2c2

Cloud Sync

Class: cloud_sync
Category: text_formatting
Code Point: eb5a

Cloud Upload

Class: cloud_upload
Category: text_formatting
Code Point: e2c3

Contact Page

Class: contact_page
Category: text_formatting
Code Point: f22e

Content Copy

Class: content_copy
Category: text_formatting
Code Point: e14d

Content Cut

Class: content_cut
Category: text_formatting
Code Point: e14e

Content Paste

Class: content_paste
Category: text_formatting
Code Point: e14f

Content Paste Go

Class: content_paste_go
Category: text_formatting
Code Point: ea8e

Content Paste Off

Class: content_paste_off
Category: text_formatting
Code Point: e4f8

Content Paste Search

Class: content_paste_search
Category: text_formatting
Code Point: ea9b

Copy All

Class: copy_all
Category: text_formatting
Code Point: e2ec

Counter

Class: counter_0
Category: text_formatting
Code Point: f785

Counter 1

Class: counter_1
Category: text_formatting
Code Point: f784

Counter 2

Class: counter_2
Category: text_formatting
Code Point: f783

Counter 3

Class: counter_3
Category: text_formatting
Code Point: f782

Counter 4

Class: counter_4
Category: text_formatting
Code Point: f781

Counter 5

Class: counter_5
Category: text_formatting
Code Point: f780

Counter 6

Class: counter_6
Category: text_formatting
Code Point: Not available

Counter 7

Class: counter_7
Category: text_formatting
Code Point: f77e

Counter 8

Class: counter_8
Category: text_formatting
Code Point: f77d

Counter 9

Class: counter_9
Category: text_formatting
Code Point: f77c

Cut

Class: cut
Category: text_formatting
Code Point: f08b

Dashboard

Class: dashboard
Category: text_formatting
Code Point: e871

Dashboard Customize

Class: dashboard_customize
Category: text_formatting
Code Point: e99b

Data Array

Class: data_array
Category: text_formatting
Code Point: ead1

Data Object

Class: data_object
Category: text_formatting
Code Point: ead3

Decimal Decrease

Class: decimal_decrease
Category: text_formatting
Code Point: f82d

Decimal Increase

Class: decimal_increase
Category: text_formatting
Code Point: f82c

Description

Class: description
Category: text_formatting
Code Point: e873

Deselect

Class: deselect
Category: text_formatting
Code Point: ebb6

Design Services

Class: design_services
Category: text_formatting
Code Point: f10a

Diagnosis

Class: diagnosis
Category: text_formatting
Code Point: e0a8

Difference

Class: difference
Category: text_formatting
Code Point: eb7d

Docs Add On

Class: docs_add_on
Category: text_formatting
Code Point: f0c2

Docs Apps Script

Class: docs_apps_script
Category: text_formatting
Code Point: f0c3

Document Scanner

Class: document_scanner
Category: text_formatting
Code Point: e5fa

Draft

Class: draft
Category: text_formatting
Code Point: e66d

Drag Handle

Class: drag_handle
Category: text_formatting
Code Point: e25d

Draw

Class: draw
Category: text_formatting
Code Point: e746

Draw Abstract

Class: draw_abstract
Category: text_formatting
Code Point: f7f8

Draw Collage

Class: draw_collage
Category: text_formatting
Code Point: f7f7

Drive File Move

Class: drive_file_move
Category: text_formatting
Code Point: e675

Drive Folder Upload

Class: drive_folder_upload
Category: text_formatting
Code Point: e9a3

Edit Document

Class: edit_document
Category: text_formatting
Code Point: f88c

Edit Note

Class: edit_note
Category: text_formatting
Code Point: e745

Edit Off

Class: edit_off
Category: text_formatting
Code Point: e950

Equal

Class: equal
Category: text_formatting
Code Point: f77b

Export Notes

Class: export_notes
Category: text_formatting
Code Point: e0ac

Fact Check

Class: fact_check
Category: text_formatting
Code Point: f0c5