1500 Icons von Font Awesome Version: 5.7.0 free in den Styles Solid (fas), Regular (far) und Brands (fab)



Mit Version 5.7 von Fontawesome ist die Food-Kategorie da

die Kategorie Medical ist nun in Vol.: 3 da

Weitere Top-Icon-Anfragen und Korrekturen!

414 Marken-Icons für viele Gelegeheiten

151 Icons Style Regular

935 Icons Style Solid




Einrichten

Download

Fontawesome 5.7.0 free web können Sie sich direkt von der Homepage von Fontawesome herrunterladen. Dort finden Sie auch einen Permanent Link dies würde Ihnen die Aktualliesierungen erleichtern, da dies dann direkt von Fontawesome geleistet wird und sie sich die Fontdateien und Scripte nicht auf Ihren Webspace laden müssten.

Aber wo bleibt denn da der Spaß

zum Download




In die Seite einbinden

Fontawesome-Link einbinden

Um den Permanent-Link von Fontawesome zu nutzen binden Sie diesen in den <head> </head> Bereich Ihrer Seite ein

<!DOCTYPE HTML>
<html> 
<head>
<meta  charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title> Titel Ihrer Seite </title>
<!-- hier den Link einfügen -->
</head>
<body> 

</body>
</html>



Beispiele

Die hier ausgestellten Beispiele beruhen auf der Darstellung durch den Link zur .css - Datei in meinem Webverzeichniss für Fontawesome Font-Icons.

unterschiedliche Größen

Beispiele:        

<!-- von Links nach Rechts -->
<i class="fas fa-home fa-lg"></i><!-- font-size: 1.33333em; -->
<i class="fas fa-home fa-2x"></i><!-- font-size: 2em; -->
<i class="fas fa-home fa-4x"></i><!-- font-size: 4em; -->
<i class="fas fa-home fa-6x"></i><!-- font-size: 6em; -->

weitere Größen wären fa-xs (.75em); fa-sm (.875em); fa-1x (1em); fa-3x (3em); fa-5x (5em); fa-7x (7em); fa-8x (8em); fa-9x (9em); fa-10x (10em); Beispiele

unterschiedliche Styles

    

<!-- von Links nach Rechts -->
<i class="fas fa-folder fa-6x"></i> <!-- Style fas für Solid -->
<i class="far fa-folder fa-6x"></i> <!-- Style far für Regular -->
<i class="fab fa-font-awesome fa-6x"></i> <!-- Style fab für Brands -->
 

In der Free-Version stehen nur diese drei Styles zur Verfügung in der Pro-Version ist noch: Light (fal) enthalten


drehen und spiegeln von Font-Icons

                             

<!-- drehen -->
<i class="fas fa-car-side fa-3x"></i> <!-- Standart Ansicht -->
<i class="fas fa-car-side fa-3x fa-rotate-90"></i> <!-- 90° -->
<i class="fas fa-car-side fa-3x fa-rotate-180"></i> <!-- 180° -->
<i class="fas fa-car-side fa-3x fa-rotate-270"></i> <!-- 270° -->
<!-- spiegeln -->
<i class="fas fa-car-side fa-3x fa-flip-horizontal"></i> <!-- horizontal -->
<i class="fas fa-car-side fa-3x fa-flip-vertical"></i> <!-- vertikal -->
<i class="fas fa-car-side fa-3x fa-flip-both"></i> <!-- both -->



animieren (drehend und pulsierend) von Font-Icons

         

<!-- drehend -->
<i class="fas fa-spinner fa-3x fa-spin"></i>
<i class="fas fa-circle-notch fa-3x fa-spin"></i>
<i class="fas fa-cog fa-3x fa-spin""></i>

         

<!-- pulsierend -->
<i class="fas fa-spinner fa-3x fa-pulse"></i>
<i class="fas fa-circle-notch fa-3x fa-pulse"></i>
<i class="fas fa-cog fa-3x fa-pulse""></i>
mehr Icons

Auf den Seiten von Font Awesome können Sie sich über weitere Beispiele und andere Formen der Nutzung vertraut machen.