Skip to content
Branch: master
Find file History
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
src Rename a handful of JavaScript and SCSS token names (#242) May 17, 2019
CHANGELOG.md Rename a handful of JavaScript and SCSS token names (#242) May 17, 2019
README.md Remove "name" field from tokens (#236) May 10, 2019
package.json Publish May 17, 2019

README.md

Thumbprint Tokens

Design variables that power Thumbtack’s UI.

Thumbprint Tokens are published as JavaScript and SCSS.

API

Token JSON files

All tokens live within a tokens/*.json file. Token files follow the following format:

{
    "name": "Color",
    "description": "These are the colors we use at Thumbtack.",
    "tokens": [
        {
            "id": "color__blue",
            "value": {
                "web": "#009fd9"
            },
            "type": "color"
        },
        {
            "id": "color__celebrate",
            "value": {
                "web": "#fbe002"
            },
            "type": "color",
            "deprecated": true,
            "description": "Use our new yellow color instead."
        }
    ]
}

Token object specification

A single token can have the following fields:

id

string, required

Unique string used to generate the variable names

name

string, required

Human readable name for the token

description

string, required

Additional information about the token

value

object, required

The value of the token in each platform that the token supports

value.web

string or number

type

string

Used for rich documentation on thumbprint.design/tokens.

Valid values include:

  • color

deprecated

bool

Indicates that a token is deprecated in the documenation and source code

You can’t perform that action at this time.