# An Inline SVG Icon System For Our Hotel Search Application

DevFeed: [An Inline SVG Icon System For Our Hotel Search Application](<https://devfeed.tech/articles/an-inline-svg-icon-system-for-our-hotel-search-application-27948.md>)

Original publisher: [Read original article](<https://tech.trivago.com/post/2016-09-05-inline-svg-icon-system/>)

Author: Radovan Janjic Principal Engineer

Published: 2016-09-05T00:00:00Z

Content type: tutorial

Language: en

Sources: [Trivago](<https://devfeed.tech/sources/trivago.md>)

Topics: [SVG](<https://devfeed.tech/topics/svg.md>), [CSS](<https://devfeed.tech/topics/css.md>), [Website](<https://devfeed.tech/topics/website.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>)

Tags: [css](<https://devfeed.tech/tags/css.md>), [frontend](<https://devfeed.tech/tags/frontend.md>), [icons](<https://devfeed.tech/tags/icons.md>), [maintainability](<https://devfeed.tech/tags/maintainability.md>), [performance](<https://devfeed.tech/tags/performance.md>), [svg](<https://devfeed.tech/tags/svg.md>), [website](<https://devfeed.tech/tags/website.md>)

## AI overview

This article explains trivago's move from image sprites to inline SVG icons embedded as CSS data URIs, with PNG fallbacks for unsupported browsers. It describes maintainability and performance problems caused by loading many unused icons and multiple builds.

## Source excerpt

Around a year ago, in our large scale refactoring project also known as Project Ironman, we stepped away from image sprites that we used for our icons. In this post we will explain our reasoning behind this decision and how it improved maintainability and website performance.