Contents
How are icons used in the Lightning design system?
Icons provide visual context and enhance usability. Read more in the Iconography design guideline and for a full list of icons available, visit the Icons page. Five separate SVG sprites are used to create icons — action, custom, doctype, standard and utility.
Where to find assistive text in Lightning design system?
Inside the container, a with the class slds-icon contains the reference to your icon and a with the class slds-assistive-text contains your hidden assistive text that describes the icon. Be sure to read the accessibility section to know when to use assistive text, the title attribute, or when neither is needed.
How are SVG sprites used in Lightning design system?
When placed into the body, the SVG sprite takes up space in the page. Use either display:none or position:absolute and set both the width and height to zero. All available SVG sprites fall into one of these five main categories: action, custom, doctype, standard, and utility.
What are the categories for icons in SLDs?
What are these categories? Selector .slds-icon_container Summary Container for icons Support dev-ready Restrict span, div Variant True
From most to least used, they are: Utility icons are simple, single-color glyphs that identify labels and actions across form factors. They can be paired with text or used alone, and can be any color. They have no background shape. Object icons fall into two categories.
How are custom icons used in Salesforce.com?
Standard object icons (e.g., Accounts, Leads, Opportunities, and Cases) come with Salesforce. Custom object icons are a unique set of icons used to create custom objects. Each object icon is made up of a white glyph on a squircle (square + circle = square with rounded corners). Object icons use a specific, limited color palette.
How big is a standard size lightning icon?
Do scale icons to standard sizes: 16 x 16px, 24 x 24px, 32 x 32px, 48 x 48px, and 60 x 60px. Don’t scale icons outside the standard sizes.
How to dynamically create components in Lightning aura?
Dynamically Creating Components. Create a component dynamically in your client-side JavaScript code by using the $A.createComponent () method. To create multiple components, use $A.createComponents (). Use $A.createComponent () instead of the deprecated $A.newCmp () and $A.newCmpAsync () methods.