SVGIconComponent

Updated on May 15, 2026

Represents the Kendo UI SVG Icon component for Angular. Used to display icons from the Kendo UI SVG Icons collection.

ts

import { KENDO_ICONS } from "@progress/kendo-angular-icons";
import { paperclipIcon } from "@progress/kendo-svg-icons";

@Component({
 selector: "my-app",
 imports: [KENDO_ICONS],
 template: `
  <kendo-svg-icon [icon]="paperclipIcon"></kendo-svg-icon>
 `,
 providers: [],
})
export class AppComponent {
 public paperclipIcon = paperclipIcon;
}

Selector

kendo-svg-icon, kendo-svgicon

Export Name

Accessible in templates as #kendoSVGIconInstance="kendoSVGIcon"

Inputs

Name	Type	Default	Description
flip	IconFlip		Flips the icon horizontally, vertically, or in both directions.
icon	SVGIcon		Sets the SVGIcon to render. Supports all Kendo UI SVG Icons.
size	IconSize		Sets the IconSize for the icon. Use this property to change the icon size.
themeColor	IconThemeColor		Sets the IconThemeColor for the icon. Use this property to apply a theme color.
variant	IconVariant		Sets the style variant of the icon. Requires @progress/kendo-svg-icons v5 or later for the variants property to be available on icons.