Design Tokens | Dennis O'Keeffe Notes

Ableton

Accessibility

Acloudguru

Adobe

Ai

Alexa

Algebra

Algorithms

Amplify

Android

Angular

Api design

Architectural principles

Arel

Art

Auth

Aws

Aws cdk

Bash

Big data

Books

Bots

Braintree

Business

Chef

Chrome

Codemod

Communication

Comp3306 ai

Comp3520 os

Complete intro to databases

Computer science

Computer systems

Consulting

Containers

Contentful

Conventional commits

Cooking

Cpp

Crontab

Css

Customer success

Cypress

D3

Data dog

Data engineering

Data science

Data structures

Databases

Dayjs

Debugging

Deno

Design

Design patterns

Design systems

Devops

Digital marketing

Distributed file systems

Docker

Dotnet

Drawio

Drupal

Dynamodb

Electron

Elixir

Elk

Elm

Emitter

Enterprise architecture patterns

Epic react

Eslint

Etcd

Ethereum

Event tracking

Expo

Express

Finance

Finger drumming

Fintech

Flask

French

Functional programming

Generative art

Git

Github

Go

Google cloud platform

Google play

Graphql

Grpc

Haskell

Hygen

Images

Interactive shells

Ios

Istio

Japanese

Java

Javascript

Jest

Jira

Jscodeshift

Kafka

Kotlin

Kubernetes

Lang chain

Language learning

Laravel

Lean product

Lerna

Linguistics

Linkedin

Linux

Machine learning

Machine learning algos

Maildev

Mathematics

Mental models

Mermaid

Mock service worker

Momentjs

Music

Music production

Mysql

Ndb

Networking

Next

Nginx

Nodejs

Npm

Osi model

P5js

Parcel

Personal

Php

Planet scale

Posix

Postgresql

Principles

Product discovery

Productivity

Productivity engineering

Programming languages

Protocols

Puppeteer

Python

Quick start

R

Raspberry pi

React

React hook form

React native

React notes

React query

React router

Reasonml

Redis

Redux

Roadmaps

Rspec

Ruby

Ruby on rails

Ruby on rails tutorial

Rust

Scala

Security

Segment

Seo

Server side react

Shape up

Shopify

Site reliability engineering

Skaffold

Sketch

Smartling

Snowpack

Software architecture

Sql

Storybook

Stripe

Style

Styled components

Supervised learning with scikit learn

Swift

System design

Tableau

Tailwind

Tensorflow

Terminal

Terraform

Testing

Threejs

Timber

Tmux

Tooling

Treat

Twig

Typescript

Ui

Unity

Unix

Ux testing

Vagrant

Vim

Virtual file systems

Visibuild

Vite

Vscode

Web

Web assembly

Web servers

Webpack

Wordpress

Writing

Xstate

Yarn

Zeit now

Design Tokens

Useful links

https://badootech.badoo.com/design-tokens-beyond-colors-typography-and-spacing-ad7c98f4f228

Elements to think about

Color
Elevation + Shadow
Font
Height
Opacity
Radius
Size
Spacing
Animation speed

Note that there are always more.

Also worth noting that when generating tokens, you will want to think of the different possible states.

Repository

https://github.com/okeeffed/developer-notes-nextjs/content/design-systems/design-tokens

Sections

Elements to think about

Related

comparing-design-systems

design-systems-overview