Technologies Demos
List of Backlight projects demoing the use of different technologies.
These are incomplete Design Systems to demonstrate how some technologies can be used in Backlight.
Design token in system-ui with examples in styled-components and theme-ui.
featuring
React
React
Components based on Adobe's react-aria, styled with CSS Modules. Design tokens in CSS Custom properties.
featuring React
React
This starter-kit is a great way to get started with Style Dictionary and have your components consume design tokens. Style Dictionary is a build system that allows you to define design decisions as tokens once, in a way for any platform or language to consume.
featuring
Style-Dictionary
CSS3
Style-Dictionary CSS3
A simple Tech Sample made with Stitches.dev CSS-in-JS runtime and System UI tokens.
featuring
stitches
System-UI
stitches System-UI
Classless Design System in Sass. Design tokens in Sass variables.
featuring CSS3
CSS3
A simple Tech Sample for building a Design System with SolidJS
featuring
solidjs
solidjs
Visually setup the design tokens of tailwindcss. Export a tailwind.config.js ready for your hot application. Also contains examples in headless-ui components for React and Vue.
featuring CSS3
CSS3
A Tech Sample starter kit based on Nunjucks for templating components and documentation.
featuring
nunjucks sass
nunjucks sass
A simple Tech Sample made with Open Props, a collection of CSS Custom Properties helping to build your Design tokens.
featuring
open-props css3
open-props css3
A simple starterkit made with Svelte and SCSS tokens.
featuring
svelte
svelte
Design System based on Vue 3, the Progressive JavaScript Framework. Tokens in CSS Custom properties.
featuring
VueJS
VueJS