apex:slds vs apex:includelightning vs apex:page lightningStylesheets="true". Which one do we need to use to enable lightning experience in existing visualforce pages?


2 Answers 2


In order to automatically style your existing Visualforce pages, WITHOUT (much) CHANGING of your Visualforce code, you want the lightningstylesheets attribute on apex:page.

As long as you Visualforce pages consist mainly of apex:sectionHeader, apex:pageBlock, apex:pageBlockSection and the like, they should style quite nicely to LEx when rendered for a user that has LEx turned on.

apex:slds on the other hand requires you to completely rewrite all of your Visualforce to follow the HTML structure specified at https://lightningdesignsystem.com/

Also, when using apex:slds, the appearance of the page will be equivalent for Classic users and LEx users; the HTML you have to author will not automatically switch to match the mode that the user is in

  • What is the usecase of apex:includelightning
    – sfdc
    Commented Nov 21, 2017 at 14:03
  • If you're using Lightning Components in your VF page, you need to get the Lightning Component runtime necessary for Lighting Out (see developer.salesforce.com/blogs/developer-relations/2016/02/… for a relevant article on Lightning Out)
    – daveespo
    Commented Nov 21, 2017 at 17:53

I'm a Visualforce platform developer within Salesforce. I view each option on a spectrum of how much time and effort you are able to put in.

  1. lightningStylesheets="true" -- Super easy to turn on, almost no testing required because it's just a stylesheet change. This is best used for Visualforce apps that you want to look better in Lightning, but don't plan on spending a lot of future effort maintaining.
  2. <apex:slds/> -- Also "just" a stylesheet, but a very picky stylesheet. It requires your page to have the markup specified by SLDS, which means you have to change the page. So you'll have to change and test the Visualforce page, but probably don't have to change the Apex controller code. This is a half-way point to writing Lightning components.
  3. <apex:includeLightning/> -- Much more than a stylesheet, this brings in the CSS and controller for Lightning components. If you make a complex Lightning app, you can include it in a Visualforce page just for users in Salesforce Classic. It's also good for changing parts of an app at a time -- if you change a page piece by piece, once the entire page is Lightning, you can just delete the page and make it a Lightning tab.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .