Font Awesome - Web Uygulama Simgeleri
Bu bölümde Font Awesome Web Uygulaması simgelerinin kullanımı açıklanmaktadır. Varsayalım kicustom aşağıda verilen örnekte gösterildiği gibi boyut ve rengi tanımladığımız CSS sınıf adıdır.
<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>
Aşağıdaki tablo, Font Awesome Web Uygulaması simgelerinin kullanımını ve sonuçlarını göstermektedir. İlgili çıktıları elde etmek için yukarıdaki programın <body> etiketini tabloda verilen kodla değiştirin -
Kullanım | Sonuç |
---|---|
<i class = "fa fa-ayarlama özel"> </i> | |
<i class = "fa fa-anchor özel"> </i> | |
<i class = "fa fa-archive özel"> </i> | |
<i class = "fa fa-area-chart özel"> </i> | |
<i class = "fa fa-oklar özel"> </i> | |
<i class = "fa fa-oklar-h özel"> </i> | |
<i class = "fa fa-oklar-v özel"> </i> | |
<i class = "fa fa-asterisk custom"> </i> | |
<i class = "fa fa-at özel"> </i> | |
<i class = "fa fa-otomobil özel"> </i> | |
<i class = "fa fa-balance-scale özel"> </i> | |
<i class = "fa fa-ban özel"> </i> | |
<i class = "fa fa-bank özel"> </i> | |
<i class = "fa fa-bar-chart özel"> </i> | |
<i class = "fa fa-bar-chart-o özel"> </i> | |
<i class = "fa fa-barcode özel"> </i> | |
<i class = "fa fa-bars özel"> </i> | |
<i class = "fa fa-bed özel"> </i> | |
<i class = "fa fa-beer özel"> </i> | |
<i class = "fa fa-bell özel"> </i> | |
<i class = "fa fa-wrench özel"> </i> | |
<i class = "fa fa-bell-o özel"> </i> | |
<i class = "fa fa-bell-slash özel"> </i> | |
<i class = "fa fa-bell-slash-o özel"> </i> | |
<i class = "fa fa-bisiklet özel"> </i> | |
<i class = "fa fa-battery-0 özel"> </i> | |
<i class = "fa fa-battery-1 özel"> </i> | |
<i class = "fa fa-battery-2 özel"> </i> | |
<i class = "fa fa-battery-3 özel"> </i> | |
<i class = "fa fa-battery-4 özel"> </i> | |
<i class = "fa fa-battery-empty özel"> </i> | |
<i class = "fa fa-battery-quarter özel"> </i> | |
<i class = "fa fa-battery-half özel"> </i> | |
<i class = "fa fa-battery-üçte üçü özel"> </i> | |
<i class = "fa fa-battery-full özel"> </i> | |
<i class = "fa fa-doğum günü-pastası özel"> </i> | |
<i class = "fa fa-bolt özel"> </i> | |
<i class = "fa fa-bomb özel"> </i> | |
<i class = "fa fa-book özel"> </i> | |
<i class = "fa fa-bookmark özel"> </i> | |
<i class = "fa fa-bookmark-o özel"> </i> | |
<i class = "fa fa-evrak çantası özel"> </i> | |
<i class = "fa fa-bug özel"> </i> | |
<i class = "fa fa-building özel"> </i> | |
<i class = "fa fa-building-o özel"> </i> | |
<i class = "fa fa-bullhorn özel"> </i> | |
<i class = "fa fa-bullseye özel"> </i> | |
<i class = "fa fa-bus özel"> </i> | |
<i class = "fa fa-cab özel"> </i> | |
<i class = "fa fa-video-camera özel"> </i> | |
<i class = "fa fa-calendar özel"> </i> | |
<i class = "fa fa-calendar-check-o özel"> </i> | |
<i class = "fa fa-calendar-minus-o özel"> </i> | |
<i class = "fa fa-calendar-o özel"> </i> | |
<i class = "fa fa-calendar-plus-o özel"> </i> | |
<i class = "fa fa-calendar-times-o özel"> </i> | |
<i class = "fa fa-camera özel"> </i> | |
<i class = "fa fa-camera-retro özel"> </i> | |
<i class = "fa fa-car özel"> </i> | |
<i class = "fa fa-cc özel"> </i> | |
<i class = "fa fa-caret-square-o-down özel"> </i> | |
<i class = "fa fa-caret-square-o-left özel"> </i> | |
<i class = "fa fa-caret-square-o-right özel"> </i> | |
<i class = "fa fa-caret-square-o-up özel"> </i> | |
<i class = "fa fa-cart-arrow-down özel"> </i> | |
<i class = "fa fa-cart-plus özel"> </i> | |
<i class = "fa fa-sertifika özel"> </i> | |
<i class = "fa fa-child özel"> </i> | |
<i class = "fa fa-check özel"> </i> | |
<i class = "fa fa-check-circle özel"> </i> | |
<i class = "fa fa-check-circle-o özel"> </i> | |
<i class = "fa fa-check-square özel"> </i> | |
<i class = "fa fa-check-square-o özel"> </i> | |
<i class = "fa fa-circle özel"> </i> | |
<i class = "fa fa-circle-o özel"> </i> | |
<i class = "fa fa-circle-o-notch özel"> </i> | |
<i class = "fa fa-circle-thin özel"> </i> | |
<i class = "fa fa-clock-o özel"> </i> | |
<i class = "fa fa-clone özel"> </i> | |
<i class = "fa fa-close özel"> </i> | |
<i class = "fa fa-anchor özel"> </i> | |
<i class = "fa fa-cloud-download özel"> </i> | |
<i class = "fa fa-cloud-upload özel"> </i> | |
<i class = "fa fa-code özel"> </i> | |
<i class = "fa fa-code-fork özel"> </i> | |
<i class = "fa fa-coffee özel"> </i> | |
<i class = "fa fa-cog özel"> </i> | |
<i class = "fa fa-cogs custom"> </i> | |
<i class = "fa fa-comment özel"> </i> | |
<i class = "fa fa-comment-o özel"> </i> | |
<i class = "fa fa-commenting özel"> </i> | |
<i class = "fa fa-commenting-o özel"> </i> | |
<i class = "fa fa-comments özel"> </i> | |
<i class = "fa fa-comments-o özel"> </i> | |
<i class = "fa fa-compass özel"> </i> | |
<i class = "fa fa-copyright custom"> </i> | |
<i class = "fa fa-creative-commons özel"> </i> | |
<i class = "fa fa-kredi-kartı özel"> </i> | |
<i class = "fa fa-crop özel"> </i> | |
<i class = "fa fa-crosshairs özel"> </i> | |
<i class = "fa fa-cube özel"> </i> | |
<i class = "fa fa-cubes özel"> </i> | |
<i class = "fa fa-cutlery özel"> </i> | |
<i class = "fa fa-dashboard custom"> </i> | |
<i class = "fa fa-veritabanı özel"> </i> | |
<i class = "fa fa-desktop özel"> </i> | |
<i class = "fa fa-diamond özel"> </i> | |
<i class = "fa fa-dot-circle-o özel"> </i> | |
<i class = "fa fa-download özel"> </i> | |
<i class = "fa fa-edit özel"> </i> | |
<i class = "fa fa-ellipsis-h özel"> </i> | |
<i class = "fa fa-ellipsis-v özel"> </i> | |
<i class = "fa fa-envelope özel"> </i> | |
<i class = "fa fa-envelope-o özel"> </i> | |
<i class = "fa fa-envelope-square özel"> </i> | |
<i class = "fa fa-silgi özel"> </i> | |
<i class = "fa fa-exchange özel"> </i> | |
<i class = "fa fa-exclamation özel"> </i> | |
<i class = "fa fa-exclamation-circle özel"> </i> | |
<i class = "fa fa-exclamation-triangle özel"> </i> | |
<i class = "fa fa-external-link özel"> </i> | |
<i class = "fa fa-external-link-square özel"> </i> | |
<i class = "fa fa-eye özel"> </i> | |
<i class = "fa fa-eye-slash özel"> </i> | |
<i class = "fa fa-eyedropper özel"> </i> | |
<i class = "fa fa-fax özel"> </i> | |
<i class = "fa fa-feed özel"> </i> | |
<i class = "fa fa-kadın özel"> </i> | |
<i class = "fa fa-savaş uçağı özel"> </i> | |
<i class = "fa fa-file-archive-o özel"> </i> | |
<i class = "fa fa-file-audio-o özel"> </i> | |
<i class = "fa fa-file-code-o özel"> </i> | |
<i class = "fa fa-file-excel-o özel"> </i> | |
<i class = "fa fa-hacim azaltma özel"> </i> | |
<i class = "fa fa-file-movie-o özel"> </i> | |
<i class = "fa fa-file-pdf-o özel"> </i> | |
<i class = "fa fa-file-photo-o özel"> </i> | |
<i class = "fa fa-file-picture-o özel"> </i> | |
<i class = "fa fa-file-powerpoint-o özel"> </i> | |
<i class = "fa fa-file-sound-o özel"> </i> | |
<i class = "fa fa-file-video-o özel"> </i> | |
<i class = "fa fa-file-word-o özel"> </i> | |
<i class = "fa fa-file-sound-o özel"> </i> | |
<i class = "fa fa-file-video-o özel"> </i> | |
<i class = "fa fa-file-word-o özel"> </i> | |
<i class = "fa fa-file-zip-o özel"> </i> | |
<i class = "fa fa-film özel"> </i> | |
<i class = "fa fa-filter özel"> </i> | |
<i class = "fa fa-fire özel"> </i> | |
<i class = "fa fa-yangın söndürücü özel"> </i> | |
<i class = "fa fa-flag özel"> </i> | |
<i class = "fa fa-flag-checkered özel"> </i> | |
<i class = "fa fa-flag-o özel"> </i> | |
<i class = "fa fa-flash özel"> </i> | |
<i class = "fa fa-flask özel"> </i> | |
<i class = "fa fa-flask özel"> </i> | |
<i class = "fa fa-klasör özel"> </i> | |
<i class = "fa fa-klasör-o özel"> </i> | |
<i class = "fa fa-klasör-aç özel"> </i> | |
<i class = "fa fa-klasör-open-o özel"> </i> | |
<i class = "fa fa-frown-o özel"> </i> | |
<i class = "fa fa-volume-off özel"> </i> | |
<i class = "fa fa-gamepad özel"> </i> | |
<i class = "fa fa-gavel özel"> </i> | |
<i class = "fa fa-gear özel"> </i> | |
<i class = "fa fa-gears özel"> </i> | |
<i class = "fa fa-gift özel"> </i> | |
<i class = "fa fa-glass özel"> </i> | |
<i class = "fa fa-globe custom"> </i> | |
<i class = "fa fa-graduation-cap özel"> </i> | |
<i class = "fa fa-group özel"> </i> | |
<i class = "fa fa-hand-grab-o özel"> </i> | |
<i class = "fa fa-hand-lizard-o özel"> </i> | |
<i class = "fa fa-hand-paper-o özel"> </i> | |
<i class = "fa fa-hand-peace-o özel"> </i> | |
<i class = "fa fa-hand-pointer-o özel"> </i> | |
<i class = "fa fa-hand-rock-o özel"> </i> | |
<i class = "fa fa-hand-scissors-o özel"> </i> | |
<i class = "fa fa-hand-spock-o özel"> </i> | |
<i class = "fa fa-hand-paper-o özel"> </i> | |
<i class = "fa fa-hdd-o özel"> </i> | |
<i class = "fa fa-kulaklıklar özel"> </i> | |
<i class = "fa fa-heart özel"> </i> | |
<i class = "fa fa-heart-o özel"> </i> | |
<i class = "fa fa-heartbeat özel"> </i> | |
<i class = "fa fa-history özel"> </i> | |
<i class = "fa fa-home özel"> </i> | |
<i class = "fa fa-hotel özel"> </i> | |
<i class = "fa fa-hourglass özel"> </i> | |
<i class = "fa fa-hourglass-start özel"> </i> | |
<i class = "fa fa-hourglass-half özel"> </i> | |
<i class = "fa fa-hourglass-end özel"> </i> | |
<i class = "fa fa-i-cursor özel"> </i> | |
<i class = "fa fa-image özel"> </i> | |
<i class = "fa fa-inbox özel"> </i> | |
<i class = "fa fa-endüstri özel"> </i> | |
<i class = "fa fa-info özel"> </i> | |
<i class = "fa fa-info-circle özel"> </i> | |
<i class = "fa fa-kurum özel"> </i> | |
<i class = "fa fa-key özel"> </i> | |
<i class = "fa fa-keyboard-o özel"> </i> | |
<i class = "fa fa-language özel"> </i> | |
<i class = "fa fa-laptop özel"> </i> | |
<i class = "fa fa-leaf özel"> </i> | |
<i class = "fa fa-legal özel"> </i> | |
<i class = "fa fa-lemon-o özel"> </i> | |
<i class = "fa fa-level-down özel"> </i> | |
<i class = "fa fa-level-up özel"> </i> | |
<i class = "fa fa-life-bouy özel"> </i> | |
<i class = "fa fa-life-ring özel"> </i> | |
<i class = "fa fa-life-saver özel"> </i> | |
<i class = "fa fa-lightbulb-o özel"> </i> | |
<i class = "fa fa-line-chart özel"> </i> | |
<i class = "fa fa-location-arrow özel"> </i> | |
<i class = "fa fa-lock özel"> </i> | |
<i class = "fa fa-magic özel"> </i> | |
<i class = "fa fa-magnet özel"> </i> | |
<i class = "fa fa-mail-forward özel"> </i> | |
<i class = "fa fa-mail-response özel"> </i> | |
<i class = "fa fa-mail-response-all özel"> </i> | |
<i class = "fa fa-erkek özel"> </i> | |
<i class = "fa fa-map özel"> </i> | |
<i class = "fa fa-map-marker özel"> </i> | |
<i class = "fa fa-map-o özel"> </i> | |
<i class = "fa fa-map-pin özel"> </i> | |
<i class = "fa fa-map-signs custom"> </i> | |
<i class = "fa fa-meh-o özel"> </i> | |
<i class = "fa fa-mikrofon özel"> </i> | |
<i class = "fa fa-mikrofon-slash özel"> </i> | |
<i class = "fa fa-minus özel"> </i> | |
<i class = "fa fa-minus-circle özel"> </i> | |
<i class = "fa fa-minus-square özel"> </i> | |
<i class = "fa fa-minus-square-o özel"> </i> | |
<i class = "fa fa-mobile özel"> </i> | |
<i class = "fa fa-money özel"> </i> | |
<i class = "fa fa-moon-o özel"> </i> | |
<i class = "fa fa-mortar-board özel"> </i> | |
<i class = "fa fa-motorcycle özel"> </i> | |
<i class = "fa fa-mouse-pointer özel"> </i> | |
<i class = "fa fa-music özel"> </i> | |
<i class = "fa fa-users özel"> </i> | |
<i class = "fa fa-nesne-grubu özel"> </i> | |
<i class = "fa fa-object-ungroup custom"> </i> | |
<i class = "fa fa-paint-brush özel"> </i> | |
<i class = "fa fa-paper-plane özel"> </i> | |
<i class = "fa fa-paper-plane-o özel"> </i> | |
<i class = "fa fa-paw özel"> </i> | |
<i class = "fa fa-kalem özel"> </i> | |
<i class = "fa fa-pencil-square özel"> </i> | |
<i class = "fa fa-kalem-square-o özel"> </i> | |
<i class = "fa fa-phone özel"> </i> | |
<i class = "fa fa-phone özel"> </i> | |
<i class = "fa fa-photo özel"> </i> | |
<i class = "fa fa-picture-o özel"> </i> | |
<i class = "fa fa-pie-chart özel"> </i> | |
<i class = "fa fa-planm özel"> </i> | |
<i class = "fa fa-volume-up özel"> </i> | |
<i class = "fa fa-plus özel"> </i> | |
<i class = "fa fa-plus-circle özel"> </i> | |
<i class = "fa fa-plus-square özel"> </i> | |
<i class = "fa fa-plus-square-o özel"> </i> | |
<i class = "fa fa-power-off özel"> </i> | |
<i class = "fa fa-print özel"> </i> | |
<i class = "fa fa-puzzle-piece özel"> </i> | |
<i class = "fa fa-qrcode özel"> </i> | |
<i class = "fa fa-question özel"> </i> | |
<i class = "fa fa-question-circle özel"> </i> | |
<i class = "fa fa-quote-left özel"> </i> | |
<i class = "fa fa-quote-right özel"> </i> | |
<i class = "fa fa-random özel"> </i> | |
<i class = "fa fa-recycle custom"> </i> | |
<i class = "fa fa-renew özel"> </i> | |
<i class = "fa fa-kayıtlı özel"> </i> | |
<i class = "fa fa-remove özel"> </i> | |
<i class = "fa fa-yeniden sırala özel"> </i> | |
<i class = "fa fa-response özel"> </i> | |
<i class = "fa fa-response-all özel"> </i> | |
<i class = "fa fa-retweet özel"> </i> | |
<i class = "fa fa-road özel"> </i> | |
<i class = "fa fa-anchor özel"> </i> | |
<i class = "fa fa-rss özel"> </i> | |
<i class = "fa fa-rss-square özel"> </i> | |
<i class = "fa fa-search özel"> </i> | |
<i class = "fa fa-search-minus özel"> </i> | |
<i class = "fa fa-search-plus özel"> </i> | |
<i class = "fa fa-send özel"> </i> | |
<i class = "fa fa-send-o özel"> </i> | |
<i class = "fa fa-server özel"> </i> | |
<i class = "fa fa-share özel"> </i> | |
<i class = "fa fa-share-alt özel"> </i> | |
<i class = "fa fa-share-alt-square özel"> </i> | |
<i class = "fa fa-share-alt-o özel"> </i> | |
<i class = "fa fa-shield özel"> </i> | |
<i class = "fa fa-ship özel"> </i> | |
<i class = "fa fa-shopping-cart özel"> </i> | |
<i class = "fa fa-sign-in özel"> </i> | |
<i class = "fa fa-sign-out özel"> </i> | |
<i class = "fa fa-signal özel"> </i> | |
<i class = "fa fa-sitemap özel"> </i> | |
<i class = "fa fa-sliders özel"> </i> | |
<i class = "fa fa-smile-o özel"> </i> | |
<i class = "fa fa-warning özel"> </i> | |
<i class = "fa fa-sort özel"> </i> | |
<i class = "fa fa-sort-alpha-asc özel"> </i> | |
<i class = "fa fa-sort-alpha-desc özel"> </i> | |
<i class = "fa fa-sort-asc özel"> </i> | |
<i class = "fa fa-sort-desc özel"> </i> | |
<i class = "fa fa-sort-down özel"> </i> | |
<i class = "fa fa-sort-numeric-asc özel"> </i> | |
<i class = "fa fa-sort-numeric-desc özel"> </i> | |
<i class = "fa fa-sort-up özel"> </i> | |
<i class = "fa fa-space-shuttle özel"> </i> | |
<i class = "fa fa-spinner özel"> </i> | |
<i class = "fa fa-spoon özel"> </i> | |
<i class = "fa fa-square özel"> </i> | |
<i class = "fa fa-square-o özel"> </i> | |
<i class = "fa fa-star özel"> </i> | |
<i class = "fa fa-star-half özel"> </i> | |
<i class = "fa fa-star-half-empty özel"> </i> | |
<i class = "fa fa-star-half-full özel"> </i> | |
<i class = "fa fa-star-half-o özel"> </i> | |
<i class = "fa fa-star-o özel"> </i> | |
<i class = "fa fa-sticky-note özel"> </i> | |
<i class = "fa fa-sticky-note-o özel"> </i> | |
<i class = "fa fa-street-view özel"> </i> | |
<i class = "fa fa-valiz özel"> </i> | |
<i class = "fa fa-sun-o özel"> </i> | |
<i class = "fa fa-support özel"> </i> | |
<i class = "fa fa-tablet özel"> </i> | |
<i class = "fa fa-takometre özel"> </i> | |
<i class = "fa fa-tag özel"> </i> | |
<i class = "fa fa-etiketleri özel"> </i> | |
<i class="fa fa-tasks custom"></i> | |
<i class="fa fa-taxi custom"></i> | |
<i class="fa fa-television custom"></i> | |
<i class="fa fa-terminal custom"></i> | |
<i class="fa fa-thumb-tack custom"></i> | |
<i class="fa fa-thumbs-down custom"></i> | |
<i class="fa fa-ticket custom"></i> | |
<i class="fa fa-times custom"></i> | |
<i class="fa fa-times-circle custom"></i> | |
<i class="fa fa-times-circle-o custom"></i> | |
<i class="fa fa-tint custom"></i> | |
<i class="fa fa-toggle-down custom"></i> | |
<i class="fa fa-toggle-left custom"></i> | |
<i class="fa fa-toggle-off custom"></i> | |
<i class="fa fa-toggle-on custom"></i> | |
<i class="fa fa-toggle-right custom"></i> | |
<i class="fa fa-toggle-up custom"></i> | |
<i class="fa fa-trademark custom"></i> | |
<i class="fa fa-tras custom"></i> | |
<i class="fa fa-trash-o custom"></i> | |
<i class="fa fa-tree custom"></i> | |
<i class="fa fa-trophy custom"></i> | |
<i class="fa fa-truck custom"></i> | |
<i class="fa fa-wheelchair custom"></i> | |
<i class="fa fa-tv custom"></i> | |
<i class="fa fa-umbrella custom"></i> | |
<i class="fa fa-university custom"></i> | |
<i class="fa fa-unlock custom"></i> | |
<i class="fa fa-unlock-alt custom"></i> | |
<i class="fa fa-unsorted custom"></i> | |
<i class="fa fa-upload custom"></i> | |
<i class="fa fa-user custom"></i> | |
<i class="fa fa-user-plus custom"></i> | |
<i class="fa fa-user-secret custom"></i> | |
<i class="fa fa-user-times custom"></i> |