Winter 18 – Automatic Styling of Visualforce Pages in Lightning Experience

Salesforce Winter 18 Logo
Salesforce Winter 18 Logo

Reason I posted previous blog was to showcase life of Visualforce developer before and after Winter 18If we want to use same Visualforce in classic and Lightning experience then we had to check theme of logged-in user in Visualforce and render page section accordingly.

However, not any more. With Winter 18we have LightningStylesheet attribute available for apex:page tag. Below source code produces same output as of previous code, however no extra logic to detect and render page section as per logged in user theme.

Winter 18 - Automatic Styling of Visualforce Pages in Lightning Experience
Winter 18 – Automatic Styling of Visualforce Pages in Lightning Experience

Note :

  • This feature is still in Beta and Salesforce team is doing their best to produce most efficient code to render existing Visualforce into Lightning experience.
  • This would be applicable only for apex: tags in Visualforce. Custom stylesheet or hacks around standard stylesheet may not work.
  • Salesforce is also working on Google chrome extension which will show existing visualforce that how existing Visualforce page will look after using this tag. However there is no confirmed URL of this extension yet and could be available in next release.


  1. Hello Sir ,
    I was trying to implement lightningstylesheets on my VisualForce page , but i was getting below error .
    “Unsupported attribute lightningstylesheets in “

  2. I just copied and pasted the code and it works like a charm. But my question is where are those filterId, listViewOptions are bind to? Also there’s an init(); method too. But i cant see the method in VF too. Please help to elaborate more. I’m pretty much new to SFDC.


  3. Hello Sir,
    How do I designate the field of data and contact data in a Visually FORCE Page so that when a data connection is saved, then a contact and an account becomes CREATE?

  4. Hi,
    We are using the lightning design in a visualforce page. For some reason, in SB it works amazing but when we deploy it to production there is no design.
    Did you have the same issue before? How can we solve it?

    Thank you,

Leave a comment

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.