- Home
- Icon Tutorial
- Font Awesome
- Font Awesome Cloud Icon
- Font Awesome Cloud-download Icon
- Font Awesome Cloud-upload Icon
- Font Awesome Code Icon
- Font Awesome Code-fork Icon
- Font Awesome Coffee Icon
- Font Awesome Cog Icon
- Font Awesome Cogs Icon
- Font Awesome Comment Icon
- Font Awesome Comment-o Icon
- Font Awesome Commenting Icon
- Font Awesome Commenting-o Icon
- Font Awesome Comments Icon
- Font Awesome Comments-o Icon
- Font Awesome Compass Icon
- Font Awesome Copyright Icon
- Font Awesome Creative-commons Icon
- Font Awesome Credit-card Icon
- Font Awesome Crop Icon
- Font Awesome Crosshairs Icon
- Font Awesome Cube Icon
- Font Awesome Cubes Icon
- Font Awesome Cutlery Icon
- Font Awesome Dashboard Icon
- Font Awesome Database Icon
- Font Awesome Desktop Icon
- Font Awesome Diamond Icon
- Font Awesome Dot-circle-o Icon
- Font Awesome Download Icon
- Font Awesome Pencil-square-o Icon
- Font Awesome Ellipsis-h Icon
- Font Awesome Ellipsis-v Icon
- Font Awesome Envelope Icon
- Font Awesome Envelope-o Icon
- Font Awesome Envelope-square Icon
- Font Awesome Eraser Icon
- Font Awesome Exchange Icon
- Font Awesome Exclamation Icon
- Font Awesome Exclamation-circle Icon
- Font Awesome Exclamation-triangle Icon
- Font Awesome External-link Icon
- Font Awesome External-link-square Icon
- Font Awesome Eye Icon
- Font Awesome Eye-slash Icon
- Font Awesome Eyedropper Icon
- Font Awesome Fax Icon
- Font Awesome Feed Icon
- Font Awesome Female Icon
- Font Awesome Fighter-jet Icon
- Font Awesome File-archive-o Icon
- Font Awesome File-audio-o Icon
- Font Awesome File-code-o Icon
- Font Awesome File-excel-o Icon
- Font Awesome File-image-o Icon
- Font Awesome File-video-o Icon
- Font Awesome File-pdf-o Icon
- Font Awesome File-powerpoint-o Icon
- Font Awesome File-word-o Icon
- Font Awesome Film Icon
- Font Awesome Filter Icon
- Font Awesome Fire Icon
- Font Awesome Fire-extinguisher Icon
- Font Awesome Flag Icon
- Font Awesome Flag-checkered Icon
- Font Awesome Flag-o Icon
- Font Awesome Flask Icon
- Font Awesome Folder Icon
- Font Awesome Folder-o Icon
- Font Awesome Folder-open Icon
- Font Awesome Folder-open-o Icon
- Font Awesome Frown-o Icon
- Font Awesome Futbol-o Icon
- Font Awesome Gamepad Icon
- Font Awesome Gavel Icon
- Font Awesome Gift Icon
- Font Awesome Glass Icon
- Font Awesome Globe Icon
- Font Awesome Graduation-cap Icon
- Font Awesome Users Icon
Font Awesome Cloud-upload Icon
Usage
<i class="fa fa-cloud-upload"></i>
Out of the box
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-cloud-upload"></i>
</body>
</html>
Live Demo
Large Icon
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-cloud-upload fa-5x"></i>
<!--use the fa-lg (33% increase), fa-2x, fa-3x, fa-4x, or fa-5x classes-->
</body>
</html>
Live Demo
Change color
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<style type="text/css">
.fa_custom {
color: #0099CC
}
</style>
</head>
<body>
<i class="fa fa-cloud-upload fa_custom"></i>
<i class="fa fa-cloud-upload fa_custom fa-2x"></i>
<i class="fa fa-cloud-upload fa_custom fa-3x"></i>
<i class="fa fa-cloud-upload fa_custom fa-4x"></i>
</body>
</html>
Live Demo
Previous: Font Awesome Cloud-download Icon
Next:
Font Awesome Code Icon
- Weekly Trends and Language Statistics
- Weekly Trends and Language Statistics