Lightning Aura Components Developer Guide

What Is the Lightning Component Framework?
Quick Start
Creating Components
Using Components
Communicating with Events
Communicating Across the DOM with Lightning Message Service
Creating Apps
Styling Apps
Using the Salesforce Lightning Design System in Apps
Using External CSS
More Readable Styling Markup with the join Expression
Tips for CSS in Components
CSS for RTL Languages
Vendor Prefixes
Styling with Design Tokens
Developing Secure Code
Using JavaScript
Working with Salesforce Data
Testing Components with Lightning Testing Service
Debugging
Performance
Reference
PDF

Newer Version Available

This content describes an older version of this product. View Latest

Styling Apps

An app is a special top-level component whose markup is in a .app resource. Just like any other component, you can put CSS in its bundle in a resource called <appName>.css.

For example, if the app markup is in notes.app, its CSS is in notes.css.

When viewed in Salesforce for Android, iOS, and mobile web and Lightning Experience, the UI components include styling that matches those visual themes. For example, the ui:button includes the button--neutral class to display a neutral style. The input components that extend ui:input include the uiInput--input class to display the input fields using a custom font in addition to other styling.

Styles added to UI components in Salesforce for Android, iOS, and mobile web and Lightning Experience don’t apply to components in standalone apps.

Note