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" ?

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.

  • Thank you, it's working, I havn't see this documentation, it's very helpful. – dou Feb 17 '17 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 Mar 1 '17 at 5:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.