1

I'm creating a lightning component using the Lightning design system. I learned that I could add the SLDS design to a lightning app with that : extends="force:slds". This way all the element in my page are styling with SLDS and I havn't to add the ltng:require tag with the SLDS stylesheet.

But I'd like to add the SLDS icons in my component, I follow this tutorial to add an icon with a static ressource. But my question is, am I obliged to use a static ressouce containing the icons, or is there a way to get these icons with the extends="force:slds" ?

1 Answer 1

3

It should be possible if you use the lightning:icon standard component.

<aura:component>
    <lightning:icon iconName="action:approval" size="large" alternativeText="Indicates approval"/>
</aura:component>

See the Lightning Design System for a list of all icons and their categories.

2
  • Thank you, it's working, I havn't see this documentation, it's very helpful.
    – dou
    Commented Feb 17, 2017 at 13:02
  • 1
    One note: the lighting:icon will probably work for most cases, but there are some LDS examples, like section title, where you need control over the CSS class applied on the <svg> tag itself. lightning:icon only allows you to put CSS on the outer wrapping HTML element, not on the <svg> tag itself.
    – Stephen
    Commented Mar 1, 2017 at 5:04

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .