- Web Icons Tutorial
- Web Icons - Home
- Web Icons - Introduction
- Font Awesome
- Font Awesome Icons
- Font Awesome - Web Icons
- Font Awesome - Hand Icons
- Font Awesome - Transportation Icons
- Font Awesome - Gender Icons
- Font Awesome - File Type Icons
- Font Awesome - Spinner Icons
- Font Awesome - Form Control Icons
- Font Awesome - Payment Icons
- Font Awesome - Chart Icons
- Font Awesome - Currency Icons
- Font Awesome - Text Editor Icons
- Font Awesome - Directional Icons
- Font Awesome - Video Player Icons
- Font Awesome - Brand Icons
- Font Awesome - Medical Icons
- Material Icons
- Material Icons
- Material - Action Icons
- Material - Alert Icons
- Material - AV Icons
- Material - Communication Icons
- Material - Content Icons
- Material - Device Icons
- Material - Editor Icons
- Material - File Icons
- Material - Hardware Icons
- Material - Image Icons
- Material - Maps Icons
- Material - Navigation Icons
- Material - Notification Icons
- Material - Social Icons
- Material - Toggle Icons
- Bootstrap Glyphicons
- Bootstrap Glyphicons
- Bootstrap - Components
- Web Icons Useful Resources
- Web Icons - Quick Guide
- Web Icons - Useful Resources
- Web Icons - Discussion
Font Awesome - Text Editor Icons
This chapter explains the usage of Font Awesome Text Editor icons. Assume that custom is the CSS class name where we defined the size and color, as shown in the example given below.
<html> <head> <link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css"> <style> i.custom {font-size: 2em; color: gray;} </style> </head> <body> <i class = "fa fa-adjust custom"></i> </body> </html>
The following table shows the usage and the results of Font Awesome Text Editor icons. Replace the < body > tag of the above program with the code given in the table to get the respective outputs −
Usage | Result |
---|---|
<i class="fa fa-align-center custom"></i> | |
<i class="fa fa-align-justify custom"></i> | |
<i class="fa fa-align-left custom"></i> | |
<i class="fa fa-align-right custom"></i> | |
<i class="fa fa-bold custom"></i> | |
<i class="fa fa-chain custom"></i> | |
<i class="fa fa-chain-broken custom"></i> | |
<i class="fa fa-clipboard custom"></i> | |
<i class="fa fa-columns custom"></i> | |
<i class="fa fa-copy custom"></i> | |
<i class="fa fa-cut custom"></i> | |
<i class="fa fa-dedent custom"></i> | |
<i class="fa fa-eraser custom"></i> | |
<i class="fa fa-file custom"></i> | |
<i class="fa fa-file-o custom"></i> | |
<i class="fa fa-file-text custom"></i> | |
<i class="fa fa-file-text-o custom"></i> | |
<i class="fa fa-files-o custom"></i> | |
<i class="fa fa-floppy-o custom"></i> | |
<i class="fa fa-font custom"></i> | |
<i class="fa fa-header custom"></i> | |
<i class="fa fa-indent custom"></i> | |
<i class="fa fa-italic custom"></i> | |
<i class="fa fa-link custom"></i> | |
<i class="fa fa-list custom"></i> | |
<i class="fa fa-list-alt custom"></i> | |
<i class="fa fa-list-ol custom"></i> | |
<i class="fa fa-list-ul custom"></i> | |
<i class="fa fa-outdent custom"></i> | |
<i class="fa fa-paperclip custom"></i> | |
<i class="fa fa-paragraph custom"></i> | |
<i class="fa fa-paste custom"></i> | |
<i class="fa fa-repeat custom"></i> | |
<i class="fa fa-rotate-left custom"></i> | |
<i class="fa fa-rotate-right custom"></i> | |
<i class="fa fa-save custom"></i> | |
<i class="fa fa-scissors custom"></i> | |
<i class="fa fa-strikethrough custom"></i> | |
<i class="fa fa-subscript custom"></i> | |
<i class="fa fa-table custom"></i> | |
<i class="fa fa-text-heigh custom"></i> | |
<i class="fa fa-text-width custom"></i> | |
<i class="fa fa-th custom"></i> | |
<i class="fa fa-th-large custom"></i> | |
<i class="fa fa-th-list custom"></i> | |
<i class="fa fa-underline custom"></i> | |
<i class="fa fa-undo custom"></i> | |
<i class="fa fa-unlink custom"></i> |
Advertisements