HTML, CSS Class Fa Fa Square, Fa Fa Icon Code Of Different Sizes

Font Awesome Square

Font Awesome Square Icon refers to a shape that has four straight sides of equal length and four 90-degree angles (right angles). This font awesome icon is also known as "fa-Square" or "fa fa Square". Try it v6 Try it v5 Try it v4

Fontawesome Version 4.X

  • Default
  • White
  • Red
  • Blue
  • Customize

square

<i class='fa fa-square'></i>

square

<i class='fa fa-square' style='color: white'></i>

square

<i class='fa fa-square' style='color: red'></i>

square

<i class='fa fa-square' style='color: blue'></i>

square

<i class='fa fa-square' style='color: #f3da35'></i> Try it Yourself

Fontawesome Version 5.X

  • Default
  • White
  • Red
  • Blue
  • Customize

square

<i class='fas fa-square'></i>

square

<i class='fas fa-square' style='color: white'></i>

square

<i class='fas fa-square' style='color: red'></i>

square

<i class='fas fa-square' style='color: blue'></i>

square

<i class='fas fa-square' style='color: #f3da35'></i> Try it Yourself

Fontawesome Version 6.X

  • Default
  • White
  • Red
  • Blue
  • Customize

square

Web

<i class='fa-solid fa-square'></i>

React

<FontAwesomeIcon icon="fa-solid fa-square" />

Vue

<font-awesome-icon icon="fa-solid fa-square" />

square

Web

<i class='fa-solid fa-square' style='color: white'></i>

React

<FontAwesomeIcon icon="fa-solid fa-square" style={{color: 'white'}} />

Vue

<font-awesome-icon icon="fa-solid fa-square" :style="{color: 'white'}" />

square

Web

<i class='fa-solid fa-square' style='color: red'></i>

React

<FontAwesomeIcon icon="fa-solid fa-square" style={{color: 'red'}} />

Vue

<font-awesome-icon icon="fa-solid fa-square" :style="{color: 'red'}" />

square

Web

<i class='fa-solid fa-square' style='color: blue'></i>

React

<FontAwesomeIcon icon="fa-solid fa-square" style={{color: 'blue'}} />

Vue

<font-awesome-icon icon="fa-solid fa-square" :style="{color: 'blue'}" />

square

Web

<i class='fa-solid fa-square' style='color: #f3da35'></i>

React

<FontAwesomeIcon icon="fa-solid fa-square" style={{color: '#f3da35'}} />

Vue

<font-awesome-icon icon="fa-solid fa-square" :style="{color: '#f3da35'}" /> Try it Yourself

FA Regular square Version 6.X

px Enter Size Color Code HTML <i class="fa-regular fa-square"></i> Copy Try it Yourself

How to add Font Awesome square Icon ?

Font Awesome Icon fa fa square Icon can be added to any web page simply as below. You can integrate Icon in web pages by just adding following below syntax & icon code.

Icon - <i class='fa fa-square'></i> Icon Code - fa fa-square

HTML Code

Get complete html code for icon square

<!DOCTYPE html> <html> <head> <title>Page Title</title> <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'> </head> <body> <i class='fa fa-square'></i> </body> </html>

Tags

shape,rectangle

Từ khóa » Html Square Icon