# Icons Font Samples

Examples of Icons Font attributes

To increase icon sizes relative to their container, use attribute `size` with value
`lg` (33% increase), `2x`, `3x`, `4x`, `5x`, `6x`, `7x`, `8x` or `9x`.

And if you build this `{docfile}` with another backend than bootstrap, don’t forget to set the `width` attribute with value 20 for `lg`, 28 for `2x`, 42 for `3x`, 56 for `4x`, 70 for `5x`, 84 for `6x`, 98 for `7x`, 112 for `8x` or 126 for `9x`.

# GlyphIcon usage

A snippet code

    image:./images/icons/glyphicon/glyphicons_364_cloud_download.png
    [
      alt="Cloud Download lg",
      icon="cloud-download",
      size="lg",
      width=20,
      iconsfont="glyphicon"
    ]

We use here the `iconsfont` attribute, because we have already set it to another value in the header block.

# Font-Awesome usage

A snippet code

    image:./images/icons/font-awesome/cloud-download.png
    [
      alt="Cloud Download 2x",
      icon="cloud-download",
      size="2x",
      width=28,
      iconsfont="font-awesome"
    ]

We use here the `iconsfont` attribute, because we have already set it to another value in the header block.

# Ionicons usage

A snippet code

    image:./images/icons/ionicons/ios7-cloud-download.png
    [
      alt="Cloud Download 3x",
      icon="ios7-cloud-download",
      size="3x",
      width=42,
      iconsfont="ionicons"
    ]

We use here the `iconsfont` attribute, because we have already set it to another value in the header block.

# Octicons usage

A snippet code

    image:./images/icons/octicons/cloud-download.svg
    [
      alt="Cloud Download 3x",
      icon="cloud-download",
      size="4x",
      width=56,
      iconsfont="octicons"
    ]

We use here the `iconsfont` attribute, because we have already set it to another value in the header block.