This gist will create CSS variables from SalesForce Design tokens

exampleScrape.css

:root {
 /*
	From: https://www.lightningdesignsystem.com/design-tokens/
 	Using Gist: https://gist.github.com/netsi1964/d8b688c3cd7a22f80087436af249b877 
 	Date: Wed Nov 02 2016 13:58:42 GMT+0100 (Romance Standard Time)
*/

--color-background: rgb(244, 246, 249);
--color-background-alt: rgb(255, 255, 255);
--color-background-alt-2: rgb(238, 241, 246);
--color-background-alt-inverse: rgb(22, 50, 92);
--color-background-row-hover: rgb(244, 246, 249);
--color-background-row-active: rgb(238, 241, 246);
--color-background-row-selected: rgb(240, 248, 252);
--color-background-row-new: rgb(217, 255, 223);
--color-background-inverse: rgb(6, 28, 63);
--color-background-browser: rgb(84, 105, 141);
--color-background-chrome-mobile: rgb(0, 112, 210);
--color-background-chrome-desktop: rgb(255, 255, 255);
--color-background-customer: rgb(255, 154, 60);
--color-background-highlight: rgb(250, 255, 189);
--color-background-highlight-search: rgb(255, 240, 63);
--color-background-selection: rgb(216, 237, 255);
--color-background-actionbar-icon-utility: rgb(84, 105, 141);
--color-background-indicator-dot: rgb(22, 50, 92);
--color-background-spinner-dot: rgb(159, 170, 181);
--color-background-modal: rgb(255, 255, 255);
--color-background-modal-brand: rgb(0, 112, 210);
--color-background-notification-badge: rgb(194, 57, 52);
--color-background-notification-badge-hover: rgb(0, 95, 178);
--color-background-notification-badge-focus: rgb(0, 95, 178);
--color-background-notification-badge-active: rgb(0, 57, 107);
--color-background-notification: rgb(255, 255, 255);
--color-background-notification-new: rgb(240, 248, 252);
--color-background-org-switcher-arrow: rgb(6, 28, 63);
--color-background-payload: rgb(244, 246, 249);
--color-background-post: rgb(247, 249, 251);
--color-background-utility-bar-hover: rgb(224, 229, 238);
--color-background-utility-bar-active: rgb(21, 137, 238);
--color-background-shade: rgb(224, 229, 238);
--color-background-shade-dark: rgb(216, 221, 230);
--color-background-stencil: rgb(238, 241, 246);
--color-background-stencil-alt: rgb(224, 229, 238);
--color-background-temp-modal: rgba(126, 140, 153, 0.8);
--color-background-temp-modal-tint: rgba(126, 140, 153, 0.8);
--color-background-backdrop: rgba(255, 255, 255, 0.75);
--color-background-backdrop-tint: rgba(240, 248, 252, 0.75);
--color-background-scrollbar: rgb(224, 229, 238);
--color-background-scrollbar-track: rgb(168, 183, 199);
--color-brand: rgb(21, 137, 238);
--color-brand-dark: rgb(0, 112, 210);
--color-brand-darker: rgb(0, 95, 178);
--color-background-toggle: rgb(159, 170, 181);
--color-background-toggle-disabled: rgb(159, 170, 181);
--color-background-toggle-hover: rgb(126, 140, 153);
--color-background-toggle-active: rgb(0, 112, 210);
--color-background-toggle-active-hover: rgb(0, 95, 178);
--color-background-context-bar: rgb(255, 255, 255);
--color-background-context-bar-brand-accent: rgb(0, 161, 223);
--color-background-context-bar-item-hover: rgb(247, 249, 251);
--color-background-context-bar-item-active: rgb(247, 249, 251);
--color-background-context-tab-bar-item: rgb(255, 255, 255);
--color-background-page-header: rgb(247, 249, 251);
--color-background-button-brand: rgb(0, 112, 210);
--color-background-button-brand-active: rgb(0, 57, 107);
--color-background-button-brand-hover: rgb(0, 95, 178);
--color-background-button-brand-disabled: rgb(224, 229, 238);
--color-background-button-default: rgb(255, 255, 255);
--color-background-button-default-hover: rgb(244, 246, 249);
--color-background-button-default-focus: rgb(244, 246, 249);
--color-background-button-default-active: rgb(238, 241, 246);
--color-background-button-default-disabled: rgb(255, 255, 255);
--color-background-button-icon: rgba(0, 0, 0, 0);
--color-background-button-icon-hover: rgb(244, 246, 249);
--color-background-button-icon-focus: rgb(244, 246, 249);
--color-background-button-icon-active: rgb(238, 241, 246);
--color-background-button-icon-disabled: rgb(255, 255, 255);
--color-background-button-inverse: rgba(0, 0, 0, 0);
--color-background-button-inverse-active: rgba(0, 0, 0, 0.24);
--color-background-button-inverse-disabled: rgba(0, 0, 0, 0);
--color-background-modal-button: rgba(0, 0, 0, 0.07);
--color-background-modal-button-active: rgba(0, 0, 0, 0.16);
--color-background-input: rgb(255, 255, 255);
--color-background-input-active: rgb(255, 255, 255);
--color-background-input-checkbox: rgb(255, 255, 255);
--color-background-input-checkbox-disabled: rgb(216, 221, 230);
--color-background-input-checkbox-selected: rgb(21, 137, 238);
--color-background-input-disabled: rgb(224, 229, 238);
--color-background-input-error: rgb(255, 221, 225);
--color-background-pill: rgb(255, 255, 255);
--color-background-image-overlay: rgba(0, 0, 0, 0.4);
--color-background-destructive: rgb(194, 57, 52);
--color-background-destructive-hover: rgb(166, 26, 20);
--color-background-destructive-active: rgb(135, 5, 0);
--color-background-info: rgb(84, 105, 141);
--color-background-error: rgb(212, 80, 76);
--color-background-error-dark: rgb(194, 57, 52);
--color-background-offline: rgb(68, 68, 68);
--color-background-success: rgb(75, 202, 129);
--color-background-success-dark: rgb(4, 132, 75);
--color-background-toast: rgb(84, 105, 141);
--color-background-toast-success: rgb(4, 132, 75);
--color-background-toast-error: rgb(194, 57, 52);
--color-background-warning: rgb(255, 183, 93);
--color-background-icon-waffle: rgb(84, 105, 141);
--color-background-path-complete: rgb(75, 202, 129);
--color-background-path-complete-hover: rgb(4, 132, 75);
--color-background-path-current: rgb(0, 112, 210);
--color-background-path-current-hover: rgb(0, 95, 178);
--color-background-path-incomplete: rgb(224, 229, 238);
--color-background-path-incomplete-hover: rgb(216, 221, 230);
--color-background-path-lost: rgb(194, 57, 52);
--color-background-guidance: rgb(250, 250, 251);
--color-text-action-label: rgb(84, 105, 141);
--color-text-action-label-active: rgb(22, 50, 92);
--color-text-brand: rgb(21, 137, 238);
--color-text-browser: rgb(255, 255, 255);
--color-text-browser-active: rgba(0, 0, 0, 0.4);
--color-text-customer: rgb(255, 154, 60);
--color-text-default: rgb(22, 50, 92);
--color-text-error: rgb(194, 57, 52);
--color-text-input-disabled: rgb(84, 105, 141);
--color-text-input-focus-inverse: rgb(22, 50, 92);
--color-text-input-icon: rgb(159, 170, 181);
--color-text-inverse: rgb(255, 255, 255);
--color-text-inverse-weak: rgb(159, 170, 181);
--color-text-inverse-active: rgb(94, 180, 255);
--color-text-inverse-hover: rgb(159, 170, 181);
--color-text-link: rgb(0, 112, 210);
--color-text-link-active: rgb(0, 57, 107);
--color-text-link-disabled: rgb(22, 50, 92);
--color-text-link-focus: rgb(0, 95, 178);
--color-text-link-hover: rgb(0, 95, 178);
--color-text-link-inverse: rgb(255, 255, 255);
--color-text-link-inverse-hover: rgba(255, 255, 255, 0.75);
--color-text-link-inverse-active: rgba(255, 255, 255, 0.5);
--color-text-link-inverse-disabled: rgba(255, 255, 255, 0.15);
--color-text-modal: rgb(255, 255, 255);
--color-text-modal-button: rgb(84, 105, 141);
--color-text-stage-left: rgb(224, 229, 238);
--color-text-tab-label: rgb(22, 50, 92);
--color-text-tab-label-selected: rgb(0, 112, 210);
--color-text-tab-label-hover: rgb(0, 95, 178);
--color-text-tab-label-focus: rgb(0, 95, 178);
--color-text-tab-label-active: rgb(0, 57, 107);
--color-text-tab-label-disabled: rgb(224, 229, 238);
--color-text-toast: rgb(224, 229, 238);
--color-text-warning: rgb(255, 183, 93);
--color-text-warning-alt: rgb(132, 72, 0);
--color-text-weak: rgb(84, 105, 141);
--color-text-icon-brand: rgb(0, 112, 210);
--color-text-icon-utility: rgb(159, 170, 181);
--color-text-toggle-disabled: rgb(216, 221, 230);
--color-text-context-bar: rgb(84, 105, 141);
--color-text-button-brand: rgb(255, 255, 255);
--color-text-button-brand-hover: rgb(255, 255, 255);
--color-text-button-brand-active: rgb(255, 255, 255);
--color-text-button-brand-disabled: rgb(255, 255, 255);
--color-text-button-default: rgb(0, 112, 210);
--color-text-button-default-hover: rgb(0, 112, 210);
--color-text-button-default-active: rgb(0, 112, 210);
--color-text-button-default-disabled: rgb(216, 221, 230);
--color-text-button-default-hint: rgb(159, 170, 181);
--color-text-button-inverse: rgb(224, 229, 238);
--color-text-button-inverse-disabled: rgba(255, 255, 255, 0.15);
--color-text-icon-default: rgb(84, 105, 141);
--color-text-icon-default-hint: rgb(159, 170, 181);
--color-text-icon-inverse-hint: rgba(255, 255, 255, 0.5);
--color-text-icon-default-hint-borderless: rgb(224, 229, 238);
--color-text-icon-default-hover: rgb(0, 112, 210);
--color-text-icon-default-active: rgb(0, 57, 107);
--color-text-icon-default-disabled: rgb(216, 221, 230);
--color-text-icon-inverse: rgb(255, 255, 255);
--color-text-icon-inverse-hover: rgb(255, 255, 255);
--color-text-icon-inverse-active: rgb(255, 255, 255);
--color-text-icon-inverse-disabled: rgba(255, 255, 255, 0.15);
--color-text-icon-inverse-hint-hover: rgba(255, 255, 255, 0.75);
--color-text-label: rgb(84, 105, 141);
--color-text-placeholder: rgb(84, 105, 141);
--color-text-placeholder-inverse: rgb(224, 229, 238);
--color-text-required: rgb(194, 57, 52);
--color-text-pill: rgb(0, 112, 210);
--color-text-success: rgb(2, 128, 72);
--color-border: rgb(216, 221, 230);
--color-border-brand: rgb(21, 137, 238);
--color-border-brand-dark: rgb(0, 112, 210);
--color-border-customer: rgb(255, 154, 60);
--color-border-destructive: rgb(194, 57, 52);
--color-border-destructive-hover: rgb(166, 26, 20);
--color-border-destructive-active: rgb(135, 5, 0);
--color-border-info: rgb(84, 105, 141);
--color-border-error: rgb(194, 57, 52);
--color-border-error-alt: rgb(234, 130, 136);
--color-border-error-dark: rgb(234, 130, 136);
--color-border-offline: rgb(68, 68, 68);
--color-border-success: rgb(75, 202, 129);
--color-border-success-dark: rgb(4, 132, 75);
--color-border-warning: rgb(255, 183, 93);
--color-border-inverse: rgb(6, 28, 63);
--color-border-tab-selected: rgb(0, 112, 210);
--color-border-separator: rgb(244, 246, 249);
--color-border-separator-alt: rgb(216, 221, 230);
--color-border-separator-alt-2: rgb(168, 183, 199);
--color-border-separator-inverse: rgb(42, 66, 108);
--color-border-row-selected: rgb(0, 112, 210);
--color-border-row-selected-hover: rgb(21, 137, 238);
--color-border-selection: rgb(0, 112, 210);
--color-border-selection-hover: rgb(21, 137, 238);
--color-border-selection-active: rgb(244, 246, 249);
--color-border-canvas-element-selection: rgb(94, 180, 255);
--color-border-canvas-element-selection-hover: rgb(0, 95, 178);
--color-border-context-bar-item: rgba(0, 0, 0, 0.2);
--color-border-context-bar-theme-default: rgb(0, 161, 223);
--color-border-context-bar-theme-default-alt: rgb(223, 228, 238);
--color-border-context-bar-theme-default-hover: rgb(11, 35, 153);
--color-border-context-bar-theme-default-active: rgb(223, 228, 238);
--color-border-icon-inverse-hint: rgba(255, 255, 255, 0.5);
--color-border-icon-inverse-hint-hover: rgba(255, 255, 255, 0.75);
--color-border-button-brand: rgb(0, 112, 210);
--color-border-button-brand-disabled: rgba(0, 0, 0, 0);
--color-border-button-default: rgb(216, 221, 230);
--color-border-button-inverse-disabled: rgba(255, 255, 255, 0.15);
--color-border-input: rgb(216, 221, 230);
--color-border-input-active: rgb(21, 137, 238);
--color-border-input-disabled: rgb(168, 183, 199);
--color-border-input-checkbox-selected-checkmark: rgb(255, 255, 255);
--color-border-tab-active: rgb(255, 255, 255);
--color-border-toggle-checked: rgb(255, 255, 255);
--color-border-path-divider: rgb(255, 255, 255);
--font-family: 'Salesforce Sans', Arial, sans-serif;
--font-weight-light: 300;
--font-weight-regular: 400;
--font-weight-bold: 700;
--font-size-x-small: 0.625rem;
--font-size-small: 0.75rem;
--font-size-medium: 0.8125rem;
--font-size-medium-a: 0.875rem;
--font-size-large: 1rem;
--font-size-x-large: 1.25rem;
--font-size-x-large-a: 1.57rem;
--font-size-xx-large: 1.75rem;
--line-height-heading: 1.25;
--line-height-text: 1.5;
--line-height-reset: 1;
--line-height-tab: 2.5rem;
--line-height-button: 1.875rem;
--line-height-button-small: 1.75rem;
--line-height-toggle: 1.3rem;
--line-height-salespath: 1.5rem;
--border-width-thin: 1px;
--border-width-thick: 2px;
--spacing-none: 0;
--spacing-xxx-small: 0.125rem;
--spacing-xx-small: 0.25rem;
--spacing-x-small: 0.5rem;
--spacing-small: 0.75rem;
--spacing-medium: 1rem;
--spacing-large: 1.5rem;
--spacing-x-large: 2rem;
--spacing-xx-large: 3rem;
--border-radius-small: .125rem;
--border-radius-medium: .25rem;
--border-radius-large: .5rem;
--border-radius-pill: 15rem;
--border-radius-circle: 50%;
--size-xx-small: 6rem;
--size-x-small: 12rem;
--size-small: 15rem;
--size-medium: 20rem;
--size-large: 25rem;
--size-x-large: 40rem;
--size-xx-large: 60rem;
--square-icon-utility-small: 1rem;
--square-icon-utility-medium: 1.25rem;
--square-icon-utility-large: 1.5rem;
--square-icon-large-boundary: 3rem;
--square-icon-large-boundary-alt: 5rem;
--square-icon-large-content: 2rem;
--square-icon-medium: 2rem;
--square-icon-medium-boundary: 2rem;
--square-icon-medium-boundary-alt: 2.25rem;
--square-icon-medium-content: 1rem;
--square-icon-medium-content-alt: 0.875rem;
--square-icon-small-boundary: 1.5rem;
--square-icon-small-content: .75rem;
--square-icon-x-small-boundary: 1.25rem;
--square-icon-xx-small-boundary: 1rem;
--square-icon-xx-small-content: .875rem;
--square-icon-x-small-content: .5rem;
--square-toggle-slider: 1.25rem;
--width-toggle: 3rem;
--height-toggle: 1.5rem;
--height-context-bar: 2.5rem;
--height-pill: 1.625rem;
--height-sales-path: 2rem;
--width-stage-left: 88%;
--height-footer: 3.75rem;
--height-header: 3.125rem;
--height-input: 1.875rem;
--height-overflow-start: 144px;
--max-height-action-overflow-menu: 628px;
--max-width-action-bar: 600px;
--max-width-action-bar-item: 120px;
--max-width-action-bar-with-labels: 320px;
--max-width-action-overflow-menu: 512px;
--square-tappable: 2.75rem;
--flex-master-panel: 7;
--square-tooltip-nubbin: 1rem;
--flex-detail-panel: 3;
--elevation-shadow-3-below: inset 0px 3px 3px 0px rgba(0,0,0,.16);
--elevation-shadow-0: none;
--elevation-shadow-2: 0px 2px 2px 0px rgba(0,0,0,.16);
--elevation-shadow-4: 0px 4px 4px 0px rgba(0,0,0,.16);
--elevation-shadow-8: 0px 8px 8px 0px rgba(0,0,0,.16);
--elevation-shadow-16: 0px 16px 16px 0px rgba(0,0,0,.16);
--elevation-shadow-32: 0px 32px 32px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-3-below: inset 0px -3px 3px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-0: none;
--elevation-inverse-shadow-2: 0px -2px 2px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-4: 0px -4px 4px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-8: 0px -8px 8px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-16: 0px -16px 16px 0px rgba(0,0,0,.16);
--elevation-inverse-shadow-32: 0px -32px 32px 0px rgba(0,0,0,.16);
--shadow-action-overflow-footer: 0 -2px 4px #F4F6F9;
--shadow-drag: 0px 2px 4px 0px rgba(0,0,0,.40);
--shadow-drop-down: 0px 2px 3px 0px rgba(0,0,0,.16);
--shadow-header: 0 2px 4px rgba(0,0,0,.07);
--shadow-button-focus: 0 0 3px #0070D2;
--shadow-button-focus-inverse: 0 0 3px #E0E5EE;
--shadow-inline-edit: 0 2px 4px 4px rgba(0,0,0,.16);
--shadow-focus-inset: 0 0 2px 2px inset #1589EE;
--shadow-docked: 0 -2px 2px 0 rgba(0,0,0,.16);
--shadow-image: 0 1px 1px rgba(0,0,0,.16);
--elevation-3-below: -3;
--elevation-0: 0;
--elevation-2: 2;
--elevation-4: 4;
--elevation-8: 8;
--elevation-16: 16;
--elevation-32: 32;
--duration-instantly: 0s;
--duration-immediately: 0.05s;
--duration-quickly: 0.1s;
--duration-promptly: 0.2s;
--duration-slowly: 0.4s;
--duration-paused: 3.2s;
--duration-toast-short: 4.8s;
--duration-toast-medium: 9.6s;
--duration-slide: 0.25s;
--mq-small: only screen and (max-width: 47.9375em);
--mq-medium: only screen and (min-width: 48em);
--mq-medium-landscape: only screen and (min-width: 48em) and (min-aspect-ratio: 4/3);
--mq-large: only screen and (min-width: 64.0625em);
--z-index-toast: 10000;
--z-index-modal: 9000;
--z-index-overlay: 8000;
--z-index-dropdown: 7000;
--z-index-dialog: 6000;
--z-index-popup: 5000;
--z-index-default: 1;
--z-index-deepdive: -99999;
}

getSalesForceDesignTokens.js

var result = ':root {\n';
result+=' /*\n\tFrom: https://www.lightningdesignsystem.com/design-tokens/\n';
result+=' \tUsing Gist: https://gist.github.com/netsi1964/d8b688c3cd7a22f80087436af249b877 \n';
result+=' \tDate: '+(new Date())+'\n*/\n\n';
Array.from(document.querySelectorAll('[data-slds-token]')).map(function(ele) {
  var value = JSON.parse(ele.getAttribute('data-slds-token'));
  var name = ele.querySelector('.docsearch-text').innerText.replace(/\$/g,'');
  var value = ele.querySelector('.site-property-value').innerText.split('\n')[0].replace(/[\{\}]/g,'');
  result+= `--${name}: ${value};\n`
});
result+='}';
copy(result)