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.

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

See Also

• Style Existing Visualforce Pages with Lightning Stylesheets in the Visualforce Developer Guide