FAQ omg-img for true developers

1. Why omg-img service?
The service empowers developers and interface designers to get new UI products to the market faster at a lower cost. It drastically increases the workflow efficiency and let your team to stay focused on business logic of your app not on the low level processing tasks such as adjusting icons sizes, colours, formats etc. You even don’t have to export an icon and store it on a server. Everything becomes much more easier with omg-img service. For example, it takes just a line of code <img src=’https://img.icons8.com/search’ /> to insert a png icon Magnifier directly from the CDN to your application of any scale.

2. Icon’s search available straight from the address bar of your browser
For your convenience, omg-img service architecture allows developers and designers to browse for new icons directly from browser’s address bar as following:
https://img.icons8.com/home
https://img.icons8.com/house
https://img.icons8.com/bungalow
https://img.icons8.com/targaryen-house
There is always an option to browse for more icons from our web site search engine UI https://icons8.com/icon/new-icons/all to get the names that you may use in constructing appropriate icons links for your apps.

3. How do I apply styles?
On our website, there is a list of icons styles on the left pane of the icons page. The list contains more than 20 various styles to outperform expectations of even the most demanding end-users of your apps. Below is the list of the most popular styles:

Omg-img let you apply a new style as easy as just inserting a style code within an icon’s link.

4. Recolouring monochrome icons made easy
To change the color of an icon with omg-img service you simply insert an appropriate color code within an icon’s link as it is demonstrated below:
https://img.icons8.com/ios/FF0000/car
https://img.icons8.com/ios/00FF00/car
https://img.icons8.com/ios/0000FF/car

5. How can I resize an icon?
To modify an icon’s size the same logic is applied as before. It’s just enough to insert an icon’s size within its link:
https://img.icons8.com/color/30px/car
https://img.icons8.com/color/40px/car
https://img.icons8.com/color/50px/car
https://img.icons8.com/color/60px/car

For your convenience, the size of an icon can be written in two different formats: 100x100 or 100px, depending on what you prefer the most.

6. How can all sorts of artefacts be minimised when using pixel perfect?
Each icon style is drawn for a specific pixel grid. Look at these few examples of various pixel grids:

  • iOS: [50x50](https://icons8.com/icons/set/50x50-pixels)
  • Metro: 26x26
  • Windows: 32x32
  • Material: 24x24
  • Color: 48x48
  • Office: [16x16](https://icons8.com/icons/set/youtube-16x16-pixels), 30x30, 40x40, 80x80

In order to avoid all sorts of artefacts (blurring edges, washed out colours etc.) associated with changing an icon’s size, we strongly recommend you to choose multiples of original icon’s size. For example for iOS style the multiples would be: 50x50, 100x100, 150x150 etc.
You can set an icon’s size either by specifying the size in pixels 100x100 / 100px or with the use of factors: 2x or x2 (the number can vary).
For example:
https://img.icons8.com/color/1x/brazilian-carnival.png
https://img.icons8.com/color/2x/brazilian-carnival.png

7. What is the maximum size of an icon that your service can provide?
The restriction applied to free png icons is 550px. Please read more in API license.

8. Which license do I need to start using omg-img?
To start using omg-img service for free, just set a link or buy paid licence.

9. What should I do if I can not find an icon that I need?
You may send us a request to draw any icon you actually need. It’s completely free. We try to do our the best to make our service comprehensive. However we do prioritise the requests which have the highest demand. You even may ask your friends, relatives and any community members to vote for your requested icon in order put your request on the very top of the queue.

10. Can an icon used in my app change over time?
In short, it’s very unlikely but possible. The most updated version of an icon is accessible by a given icon’s link.
E.G. currently for the following link https://img.icons8.com/water-molecule we keep showing an icon with illustration of a water drop or an abstract molecule. However if we begin to receive more and more requests to change the icon’s appearance to say a water molecule like this H2O, then most probably we will alternate its look somehow to represent the structure of two atoms of hydrogen and one atom of oxygen bonded together.

In case if you are planning to use an icon longterm, the best solution would be to use the canonical full path to the icon (.png), which can be formed here.

11. Can I use an icon with .png extension?
Yes you can use icons with .png extension in omg-img service, however you would need to know the exact name of a .png icon. The .png names could differ from the names provided by the service. In order to find the desired .png icon name and create an appropriate query for it, you may use searching engine UI available on our website here.

12. How to use responsive size for Office style?
It’s quite simple. Just add a parameter office to your request. For example:
https://img.icons8.com/office/50px/car.png?office=16
https://img.icons8.com/office/50px/car.png?office=30
https://img.icons8.com/office/50px/car.png?office=40
https://img.icons8.com/office/50px/car.png?office=80

1 Like

This guide is cool, but it definitely needs some proofreading/editing.

2 Likes

Thanks for the review! Changed

Probably this guide needs an update.

  • I don’t see how the search is available as pointed in 2. When following one of the links, I only see a single image file. From the description I expect a list of images with the given term.
  • Defining the size (5.) using /30px/ in the URL doesn’t work. Just remove “px” (/30/) and it works again.
  • How do I get the pixel perfect size (6.) for an icon when using the API? IMHO this should be a value beeing returned in the resulting JSON.
  • I don’t see a difference in the result when using the different “office” arguments using the current omg img service.

Thanks
Daniel

1 Like

Yep, a lot has changed

Search - it is better to search for icons through the main page. Then you can select the icon, the URL will look at it and insert it into your code.

30px and 30x30 - yes does not work. Only scaling 1x 2x 3x and so on

Pixel perfect - now you can find out by writing 1x size in the browser

Office icons were divided into 4 styles:
OfficeL - 80px - https://img.icons8.com/officel/1x/home.png
Office - 40px - https://img.icons8.com/office/1x/home.png
OfficeS - 30px - https://img.icons8.com/offices/1x/home.png
OfficeXS - 16px - https://img.icons8.com/officexs/1x/home.png

2 Likes