Loading
Prepare for Email to Become the Default Login ExperienceRead More
Multiple Salesforce Services Impacted - Support Case Creation Also AffectedRead More
Intermittent freezing when using using certain browser versionsRead More
Set Up and Maintain Your Salesforce Organization
Apply Lightning Stylesheets to Visualforce Pages Manually

Apply Lightning Stylesheets to Visualforce Pages Manually

With Lightning stylesheets, it’s easy to tweak your existing Visualforce pages so they’ll display with classic styling in Salesforce Classic and Lightning styling in Lightning Experience.

Required Editions

Available in: Group, Professional, Enterprise, Performance, Unlimited, and Developer Editions
User Permissions Needed
To create, edit, or delete Visualforce pages: Customize Application
  1. From Setup, enter Visualforce in the Quick Find box, then select Visualforce Pages.
  2. Click Edit next to the Visualforce page.
  3. Add the lightningStylesheets="true" attribute to the initial <apex:page> component in the Visualforce markup.
    <apex:page standardController="Account" lightningStyleSheets="true">
  4. Save your changes.

When Lightning stylesheets are applied, here’s how a Visualforce page looks in Salesforce Classic.

Screenshot of how a Visualforce page that's using the Lightning stylesheets looks in Salesforce Classic.

And here’s how the same page appears in Lightning Experience.

Screenshot of how a Visualforce page that's using the Lightning stylesheets looks in Lightning Experience.
 
Loading
Salesforce Help | Article