Here are the main changes to use the Lightning Design stylesheet.

Note that for more complex pages, you should rewrite the page as it will always look like a Classic page - not much Lightning - a first step though.


<apex:page applyBodyTag="false" docType="html-5.0">

(not required, but suggested)

The directly after this line (assuming you uploaded the SLDS080):


<html xmlns="" xmlns:xlink=""> 
  <apex:stylesheet value="{!URLFOR($Resource.SLDS080, 'assets/styles/salesforce-lightning-design-system-vf.css')}" />
<div class="slds">

  and before the closing </apex:page>





- add 
styleClass="slds-button slds-button--neutral"

sometimes, the buttons are a bit too big or are wrapped, so I use the style:


.slds .slds-button--small {
  padding: 0 .5rem;
  font-size: smaller;
  white-space: nowrap;
  line-height: 1.5rem;



will be cramped together and separators are not rendered correctly

- set itemSeparator="none" and add spaces

- or if that does not help, add

.rich-toolbar-item {
  display: inline;
  margin-right: 10px;


apex:pageBlockSection collapsible="true"

will display on two lines - add 

.slds h3 {
  display: inline-block;


Depending on what Visualforce tags you use, there might be more fixes necessary.