---
path: foundation/iconography/svg-icons
title: SVG Icons
position: 2
seo_title: SVG Icons in the Telerik and Kendo UI Design System
seo_description: Learn what are SVG icons and what are the benefits of using SVG icons.
---
## SVG Icons Overview
SVG icons are vector images defined in XML format. Because they are blocks of XML tags, they allow a webpage to display vector graphics. Their major advantage is that you can scale them to any size without any quality degradation.
### Advantages
When it comes to displaying vector graphics on a webpage, you have several options. Two of them are [font icons](/foundation/iconography/font-icons/) and SVG icons.
The main benefits of using SVG icons are:
- Rendering and Scalability—SVG icons are treated by the browsers as images, so anti-aliasing issues are avoided. This ensures that SVG icons are sharp at all resolutions, without losing quality.
- Flexibility:
- You can control the individual parts of an SVG icon through CSS (font size, color, animation).
- You can apply SVG-specific CSS filters and stroke properties.
- You can create SVG icons that include multiple colors.
- Accessibility—Using semantic elements and attributes, such as `title`, `desc`, and `aria-labelledby` makes them accessible to screen readers, search engines, and other devices.
### Usage
The Telerik and Kendo UI SVG icons are available as an NPM package that contains the definitions and metadata of the icons.
`npm install --save @progress/kendo-svg-icons`
### Download
To download the Telerik and Kendo UI SVG Icons, click the button below.
### Framework-Specific Documentation
For specific information about the font icons in the context of the Telerik and Kendo UI libraries, refer to the official product documentation:
