Fort Awesome Kit Demo altinn.no

Below you'll find an inventory and examples of icons, and how to use them and the support styling.

Your Icons


  • ai-download f008
  • ai-arrowrightup f009
  • ai-money f017
  • ai-skatteetaten f019
  • ai-aordningen f01a
  • ai-phone f01b
  • ai-sign f01f
  • ai-write f020
  • ai-read f021
  • ai-archive f023
  • ai-plus f026
  • ai-corp f027
  • ai-private f028
  • ai-others f029
  • ai-deadline f02a
  • ai-tax f02b
  • ai-exit f02c
  • ai-search f02d
  • ai-back f02e
  • ai-expand f030
  • ai-undo f031
  • ai-openmessage f032
  • ai-closedmessage f033
  • ai-help f034
  • ai-edit f035
  • ai-document f036
  • ai-settings f037
  • ai-server f039
  • ai-info f03a
  • ai-arrowright f03d
  • ai-keyhole f03e
  • ai-expand-circle f03f
  • ai-circle-exit f040
  • ai-upload f041
  • ai-help-popicon f042
  • ai-check f043
  • ai-circle-plus f046
  • ai-circle-minus f047
  • ai-facebook f049
  • ai-twitter f04a
  • ai-linkedin f04b
  • ai-date f04c
  • ai-send f04d
  • ai-info-circle f04f
  • ai-check-circle f052
  • ai-attachment f053
  • ai-forward f054
  • ai-trash f055
  • ai-circle-exclamation f056
  • ai-family f057
  • ai-more f058
  • ai-archive-alt f059
  • ai-print f05a
  • ai-client f05b
  • ai-letter-a f05d
  • ai-letter-b f05e
  • ai-letter-c f05f
  • ai-letter-d f060
  • ai-letter-e f061
  • ai-letter-f f062
  • ai-letter-g f063
  • ai-letter-h f064
  • ai-letter-i f065
  • ai-letter-j f066
  • ai-letter-k f067
  • ai-letter-u f068
  • ai-letter-v f069
  • ai-letter-w f06a
  • ai-letter-x f06b
  • ai-letter-y f06c
  • ai-letter-l f06d
  • ai-letter-m f06e
  • ai-letter-n f06f
  • ai-letter-o f070
  • ai-letter-p f071
  • ai-letter-q f072
  • ai-letter-r f073
  • ai-letter-s f074
  • ai-letter-t f075
  • ai-letter-z f076
  • ai-letter-ae f077
  • ai-letter-oo f078
  • ai-letter-aa f079
  • ai-keyhole-circle f07a
  • ai-private-circle-big f07b
  • ai-plain-circle f07d
  • ai-plain-circle-big f07e
  • ai-corp-circle-big f07f
  • ai-lock-open f080
  • ai-locked f081
  • ai-plain-circle-test f082
  • ai-exit-test f083
  • ai-stop f084
  • ai-government f085
  • ai-government-circle-big f086
  • ai-circletrash f087
  • ai-circlecancel f088
  • ai-circlecheck f089
  • ai-arrow-down f08a
  • ai-knapplogikk f08b
  • ai-knapppreview f08c
  • ai-favourite f08d
  • ai-favourite-inactive f08e
  • ai-favourite-inactive-alt f08f
  • ai-favourite-selected f090
  • ai-pin f091
  • ai-agreement f092
  • ai-request f096
  • ai-link f097
  • ai-screen f098

Using your icons on the web

You can place your Fort Awesome icons just about anywhere using your CSS kit prefix and the icon's name. Fort Awesome icons are designed to be used with inline elements (we like the <i> tag, but you can use ><span> too).

Example
<i class="ai ai-more"></i>

If you change the font-size of the icon's container, the icon gets bigger. Same things goes for color, drop shadow, and anything else you can imagine with CSS.

Still need help getting started? Check out our how-to article on using icons.

Icon Styling Support

Larger Icons

Example

ai-lg

ai-2x

ai-3x

ai-4x

ai-5x

List Icons

Example
  • List icons
  • can be used
  • as bullets
  • in lists

Bordered & Pulled Icons

Example
Gatsby believed in the green light, the orgastic future that year by year recedes before us. It eluded us then, but that’s no matter—tomorrow we will run [kit_prefix]ster, stretch out our arms [kit_prefix]rther… And then one fine morning— So we beat on, boats against the current, borne back ceaselessly into the past.

Animated Icons

Note: We like using these animated classes with things like spinners, gears, and loaders.

Example

Rotated & Flipped

Example
  normal
  fa-rotate-90
  fa-rotate-180
  fa-rotate-270
  fa-flip-horizontal
  fa-flip-vertical

Stacked Icons

Example

Your Typefaces


This Kit Doesn't Have Any Typefaces

Hey. It looks like you don't have any typefaces currently in this kit. Its pretty easy to add some or even upload your own.

Bits About This Kit


Kit Name:
altinn.no
Kit ID:
ed31cded
Icon Prefix:
ai
Icons:
110
Typefaces:

Documentation & Support


This kit has extensive documentation for use on the web and on the desktop. Check out https://fortawesome.com/share/eyJhbGciOiJIUzI1NiJ9.eyJraXQiOiJlZDMxY2RlZCJ9.ggJFjF1S2edTtzzsI3fzIvLUd0xzCpDqL1Ddptk_aBI/kit-documentation.

Need an example or walkthrough? Check out our Fort Awesome how-to guides on desktop use, serving things yourself, and basic icon use.

View & Edit this Kit


This demo page look out of date or is it missing something? You can edit assets, names, and settings on Fort Awesome.

View & Edit on Fort Awesome

Heads up! You'll need to the kit owner to view.