• /
We are sorry you canceled your Premium subscription

You can still enjoy Flaticon Collections with the following limits:

  • You can choose only 3 collections to keep
  • You can only add up to 100 icons per collection
  • You cannot add Premium icons to your collection
The advantages of your collections changed
  • You can choose only 3 collections to keep
  • You can only add up to 100 icons per collection
  • You cannot add Premium icons to your collection

Keep making the most of your icons and collections

Get 20% OFF our
Annual Premium Plan

  • /
Select up to 3 collections to continue:

You have 8 collections but can only unlock 3 of them

    Stay Premium

    Select a color from the icon

      Choose a new color

      History

        Scale

        Move

        Move left
        Move right
        Move up
        Move down

        Rotate

        Rotate 90º right
        Rotate 90º left

        Flip

        Flip horizontal
        Flip vertical

        Select a shape

        None
        Circle
        Rounded square
        Square

        Size

        Color

        Undo
        Redo

        SVG Sprites

        SVG sprites let you quickly use vector icons in your website. Check this page to learn more about SVG sprites and how to use them with Flaticon.

        Features

        • 1. High resolution

          SVGs are scalable and retina-ready. Perfect for a responsive design. They look nice on screens of any resolution.

        • 2. Quick and easy

          Building iconfonts with Flaticon is easier than ever. Add icons to your collections and download them in seconds.

        • 3. Total control CSS

          SVGs are easily customizable with CSS and have specific rules to change their look.

        • 4. Accesible

          Flaticon name SVGs using common terms to help screen readers understand their meaning ;-)

        • 5. Animatable

          CSS transitions and animations are completely compatible with SVG sprites.

        • 6. Tidy

          No more loads of images or cumbersome PNG sprites. Stop wasting your time!

        How to use SVG sprites with flaticon

        SVG sprites Tutorial Part 1
        1. Prepare your collection

        Add icons to the collection for your website

        2. Download the sprite

        Open your collection and press the Download collection button, then select SVG sprite

        SVG sprites Tutorial Part 2
        SVG sprites Tutorial Part 3
        3. Copy in your folder

        Copy the source file to your web folder..

        4. Load the sprite

        Insert the content of your SVG Sprite in your HTML code.

        <link rel="stylesheet" type="text/css" href="your_website_domain/css_root/flaticon.css">
        SVG sprites Tutorial Part 4
        SVG sprites Tutorial Part 5
        5. Use the IDs

        Use the id of each icon so that they appear on your website. After that, customize them with CSS..

        Use example: <i class="flaticon-airplane49"></i> or <span class="flaticon-airplane49"></span>
        ×
        adobe

        How likely are you to recommend Flaticon to a friend?

        0 1 2 3 4 5 6 7 8 9 10
        Not likely Very likely