open-props Documentation

File: readme.md

CDN ([browse](https://unpkg.com/browse/open-props@latest/))

https://unpkg.com/open-props
https://unpkg.com/open-props/normalize.min.css - Normalize (light + dark) demo
https://unpkg.com/open-props/open-props.tokens.json - Design Tokens
https://unpkg.com/open-props/open-props.figma-tokens.sync.json - Figma Design Tokens
https://unpkg.com/open-props/open-props.style-dictionary-tokens.json - Style Dictionary Tokens

Bookmarklet

javascript: (() => {
  const href = "https://unpkg.com/open-props";
  document.head.append(Object.assign(document.createElement("link"),{rel:"stylesheet",href}));
})();

CLI

npm run gen:op - runs through src/ js files and creates the PostCSS files in src/
npm run gen:nowhere - creates a version of Open Props without the use of :where()
npm run gen:shadowdom - creates a version of Open Props with :host as the selector scope
npm run gen:prefixed - creates a version of Open Props with each prop prefixed with op, like --op-font-size-1
npm run bundle - creates all the various minified bundles of props
npm run lib:js - builds the JS modules for NPM

Testing

bash

npm run build && npm run bundle
npm test

File: CHANGELOG.md

Changelog

All notable changes to this project will be documented in this file. Dates are displayed in UTC.

Generated by auto-changelog.

[v1.7.23](https://github.com/argyleink/open-props/compare/v1.7.22...v1.7.23)

31 January 2026

Add commit message input to version-bump workflow #585
✂️ 1.7.23 74515a5

[v1.7.22](https://github.com/argyleink/open-props/compare/v1.7.21...v1.7.22)

31 January 2026

Add id-token permission to version-bump workflow #584
Add TypeScript types to submodule exports #582
[WIP] Fix issue with npm_publish workflow not triggering #583
✂️ 1.7.22 ef7acc0

[v1.7.21](https://github.com/argyleink/open-props/compare/v1.7.20...v1.7.21)

31 January 2026

Add non-adaptive shadows.light.min.css and shadows.dark.min.css exports #580
Inject docsite version from package.json at build time #578
✂️ 1.7.21 1368169

[v1.7.20](https://github.com/argyleink/open-props/compare/v1.7.19...v1.7.20)

31 January 2026

build and action fixes a547335
✂️ 1.7.20 6a208d1

[v1.7.19](https://github.com/argyleink/open-props/compare/v1.7.18...v1.7.19)

31 January 2026

Add workflow_dispatch action for version bumping #577
Update NPM Publish workflow to latest action versions #576
chore: bump version to 1.7.19 1f63fef

[v1.7.18](https://github.com/argyleink/open-props/compare/v1.7.17...v1.7.18)

30 January 2026

Add new resolver tokens to docs #575
Add interactive shadow playground and fix shadow CSS regression #573
Add interactive duration documentation with animated demo #574
Support shadows in design tokens #570
Group design tokens #569
Support fonts in design tokens resolver #568
feat: add palette file, add palette tests #566
Support latest design tokens specification #567
✂️ v1.7.18 1c10c5f

[v1.7.17](https://github.com/argyleink/open-props/compare/v1.7.16...v1.7.17)

1 December 2025

fix(duration): add missing semicolon #564
Fix: restore newline so logo renders properly in README #560
✂️ v1.7.17 5a79f44

[v1.7.16](https://github.com/argyleink/open-props/compare/v1.7.15...v1.7.16)

10 July 2025

Add Robert Penner's easing functions (#526) #559
✂️ v1.7.16 with classic easing variables, thx #559! 5d458d2

[v1.7.15](https://github.com/argyleink/open-props/compare/v1.6.0...v1.7.15)

8 April 2025

feat: auto-upgrade gradients to oklab and HDR (#397) #554
Optimizing the mask gradients #553
add animation durations #550
Added flinch to durations.css #548
fix: add missing size-px props to style-dictionary-tokens #543
fix(normalize): use surface-3 on tr:hover #544
chore: document theme switch imports #540
Fix: Ensure consistent fonts and correct usage of --font-monospace-code #542
Add text-decoration: none to .btn links for better styling #538
chore: add field-sizing to select and textarea #535
Add social media brand colors pack (Closes #471) #520
Fix typo in index.html - ease-elastic-out-3 #516
fix docsite font-size-fluid variables #508
Add Modern Font Stacks #498
Drawn Borders #496
add px-based sizes #493
Remove anchor link focus padding #492
add shake-z animation #489
Fix media queries "-only" breakpoints bug and update documentation #488
Assorted typos #487
add from-one class to size and box-shadow demos #482
Fix Gradient Docs #480
Implement clickable color swatches to copy color props to clipboard #476
Fix the broken link for durations.css #477
durations.css – correct leap-year duration; introduce olympiad #475
Add script to generate bundle sizes #474
docs: configure Open Graph metadata properly #472
feat(media): add inverted colors custom media query #469
undo part of 327a70f (#392) to fix #455 to make figma-tokens plugin work again #456
fix: naming to --animation-slide-in-up #452
bookmarklet suggestion #447
feat(custom-media): add --forcedColors to the custom media queries list #445
fix(customMQ): extend --HDcolor media query with color-gamut check #444
fixes #440 #441
Chore: add width: fit-content to a tag #436
fix(props.js): prefix mask individual props file names as all others #435
Style dictionary tokens #433
Bounce easings #430
fix referencing of elastic easing #428
fixes #425 #426
Created durations.css to address #415; #424
Add social media brand colors pack (Closes #471) (#520) #471 #471
Add Modern Font Stacks (#498) #500
undo part of 327a70f (#392) to fix #455 to make figma-tokens plugin work again (#456) #455
fixes #440 (#441) #440
fixes #298 #298
fixes #425 (#426) #425
[docsite] update vite, remove @nest ff5efea
📖 v1.6.10 - adds style dictionary json 62317b4
v1.6.5 text color improvements to normalize e297950

[v1.6.0](https://github.com/argyleink/open-props/compare/v1.5.1...v1.6.0)

29 September 2023

v1.6 #421
balance figcaptions #418
custom plugin to combine rules #412
fix typo #413
adds inner-shadow-highlight variable to inner shadow 1-4 #399
fix breaking centered text-alignment for td, th #400
restore #408
fixes #310 #395
Table styles #394
Spring Easings ⚽️ #387
add text-wrap: balance; #382
add relative sizes to OP #370
fix inconsistent quotes #377
fix #375 #376
Text cursor on text inputs #368
Fix documentation for postcss JIT plugin in CSS mode #369
Fix accessibility issues on theme toggle button #365
fixes #310 (#395) #310
Table styles (#394) #319
fixes #392 #392
fixes #386 #386
fixes #385 #385
fix #375 (#376) #375
Text cursor on text inputs (#368) #366
fixes #364 #364
bug fix for bright oklch color f7fe070
cut v1.5.16 ✂️ a641661
✂️ v1.5.15 dd553ca

[v1.5.1](https://github.com/argyleink/open-props/compare/v1.5.0...v1.5.1)

30 March 2023

init build process #360
op-logo-svg-fix #359
chore: include color helper #355
typescript part 2: electric boogaloo #338
add TS support, cleans up modules #335
docs: autocomplete instructions in Sublime Text #330
Fix redundant selectors in normalize #331
Add missing exports for masks and media js files #326
update autocomplete settings #323
fixes #353 #353
fixes #327 #327
updates color demos to align with codepen updates b22fe8e
cut v1.5.1 - esm custom media 8e54deb
cut v1.5.7 🎨 19690a1

[v1.5.0](https://github.com/argyleink/open-props/compare/v1.4.17...v1.5.0)

20 November 2022

v1.5.0 #317
Fix range padding #309
fix dark and light normalize #302
animate outline offset for buttons #301
v1.5.0 (#317) #232 #296 #316
cut v1.4.25, fixes #312 #312
fix dark and light normalize (#302) #299
cuts v1.4.20 with dark mode fixes 340f141
fixes icons after normalize update 21859f3
cut v1.4.19 0e0cfe4

[v1.4.17](https://github.com/argyleink/open-props/compare/v1.4.0...v1.4.17)

28 October 2022

normalize light and dark imports #285
Update VScode instruction #293
docs: update pos-css link with new repo #292
Fix #278 and extend with --firefoxMacONLY, --chromiumONLY, --webkitONLY #280
fixes #283 #284
fixes #277 #279
replace single '' with ""in build scripts #282
A tiny update to the scooped edges #269
color-scheme adaptive fade-in/out-bloom #268
Better syntax for the corner cuts #265
fade-in-bloom and fade-out-boom for #255 #260
Optimizing the Scalloped edges #262
Small typo in the Doc #261
Optimizing the Drips edges + minor updates #259
Optimization for the mask edges #258
Optimizing the code of square cut a little #257
Masks #126
fix: vscode-cssvar documentation for setting example #256
fixes #245 #246
renamed --scrollbar-color to --scrollthumb-color and set grays that pass WCAG AA contrast ratios with surfaces in dark and light modes #243
Fix #278 and extend with --firefoxMacONLY, --chromiumONLY, --webkitONLY (#280) #278
fixes #283 (#284) #283
fixes #277 (#279) #277 #277
fixes #276 #276
fixes #266 #266
fixes #253, cut release #253
fixes #252 #252
fixes #245 (#246) #245 #245
document new bloom animations 28606ed
ready for simple file mods b4ec9c6
fixes masks having :host as selector 94fed77

[v1.4.0](https://github.com/argyleink/open-props/compare/v1.3.16...v1.4.0)

1 July 2022

Shadow DOM builds #241
Shadow DOM builds (#241) #240
push lock for ci builds c1bbf3d
fixes build machines running out of memory during bundling a04a090
updates job script to latest 35e8c25

[v1.3.16](https://github.com/argyleink/open-props/compare/v1.0.0...v1.3.16)

1 June 2022

update cssnano #235
Add unnecessary config files to the .npmignore & change logo alt text #226
fixes #227 #228
Add .github and .firebaserc to .npmignore #224
Adjust build script to improve readability #221
Jit props dark adaptive props #220
fixes #211 #219
fixes #216 #218
Made the scrollnav bar work on firefox #210
fixes #188 #206
Update gradient import in docs #198
Fix build on windows devices #193
fix to draft spec #196
Object accessor DX #190
add src/ folder to package.json exports #187
fixes #180 #181
Fix typo #179
DOCS: Fix counters in Firefox #177
update colors-hsl usage in docs #176
HSL for all colors #171
remove vertical-align as it doesn't apply on display: block-elements #172
Fix missing anchor in footer-link #170
Extras buttons.min.css #154
Add t-shirt size props to sizes #164
fixes #125 #162
fix: Update props.animations formatting #157
normalize iOS safari landscape body font size #151
Update readme to reflect all categories #147
generate JSON for figma-tokens plugin to use #144
fix: shadow counter on firefox #145
Bugfix/responsiveness site #142
docs: add autocomplete guidelines for users that use VScode as their primary IDE #130
Jit animations fix #138
Updating tabindex selector to exclude negative values #134
fix a custom proprty in usage field #131
fix subheading background gradient #132
Design token color types #123
Import JSON #97
Proposed edits to docsite copy #91
Fix typo: provie => provide #90
removes supports vars #88
Fix typo where "CSS plugin" should be "PostCSS plugin" IMHO #82
fixes #227 (#228) #227
fixes #211 (#219) #211
fixes #216 (#218) #216
fixes #215 #215
fixes #188 (#206) #188
fixes #200 #200
Object accessor DX (#190) #189
fixes #182 #182
fixes #180 (#181) #180 #180
fixes #174 #174
fixes #146 #146
fixes #158 #158
fixes #125 (#162) #125 #125
fixes #149 #149
fixes #143 #143
Design token color types (#123) #111
fixes #81 #81
fixes #110 #110
fixes #96 - plus some #96
removes supports vars (#88) #77 #85
fixes #76 #76
removes the 3 unused mixins cdd45bc
docsite fixes and nudges to demos a858c03
fool microbundle a1ae306

[v1.0.0](https://github.com/argyleink/open-props/compare/v0.0.2...v1.0.0)

29 November 2021

Create LICENSE #59
Custom highlighting #58
Scroll Spy #53
fixes #54 #55
Deploy to Firebase #52
Theme toggle #42
Responsive radii #37
[WIP] Generate CSS from JS objects #32
Docsite #22
fixes #54 (#55) #54 #54
fixes #45 #45
fixes #50 #50
fixes #49 #49
fixes #47 #47
fixes #38 #38
fixes #40 #40
fixes #8 #8
fixes #34 #34
Responsive radii (#37) #36
fixes #9 #9
microbundle props to JS for JS delivery #1
fixes #12 #12
fixes #7 #7
adds tests and test workflow 467acb2
use lib from npm 61567de
deploy to firebase d9a1672

v0.0.2

10 September 2021

adds builds 8efac23
Initial commit 0cd8de4
adds colors from open-colors project 9368ef1

File: firebase.json

{
"hosting": {
"public": "docsite/dist",
"ignore": [
"firebase.json",
"/.*",
"/node_modules/**"
]
}
}

File: open-props.resolver.json

{
"version": "2025.10",
"name": "Open Props",
"description": "CSS custom properties to help accelerate adaptive and consistent design.",
"resolutionOrder": [
{
"type": "set",
"name": "Open Props",
"sources": [
{
"inner-shadow": {
"0": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 1,
"unit": "px"
},
"inset": true
}
},
"1": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 1,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
1,
1,
1
],
"hex": "#fff"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
0,
0,
0
],
"alpha": 0.06666666666666667,
"hex": "#0001"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
}
]
},
"2": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 1,
"unit": "px"
},
"blur": {
"value": 4,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
1,
1,
1
],
"hex": "#fff"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
0,
0,
0
],
"alpha": 0.06666666666666667,
"hex": "#0001"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
}
]
},
"3": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 2,
"unit": "px"
},
"blur": {
"value": 8,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
1,
1,
1
],
"hex": "#fff"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
0,
0,
0
],
"alpha": 0.06666666666666667,
"hex": "#0001"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
}
]
},
"4": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 2,
"unit": "px"
},
"blur": {
"value": 14,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
1,
1,
1
],
"hex": "#fff"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
},
{
"color": {
"colorSpace": "srgb",
"components": [
0,
0,
0
],
"alpha": 0.06666666666666667,
"hex": "#0001"
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0.5,
"unit": "px"
},
"blur": {
"value": 0,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
},
"inset": true
}
]
}
},
"text": {
"shadow-6": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.55
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 10,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
},
"shadow-5": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.5
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 7,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
},
"shadow-4": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.45
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
},
"shadow-3": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.4
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 3,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
},
"shadow-2": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.35
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
},
"shadow-1": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.3
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 0,
"unit": "px"
},
"blur": {
"value": 1,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
}
}
},
"shadow": {
"1": {
"$type": "shadow",
"$value": {
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.1
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 1,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": -1,
"unit": "px"
}
}
},
"2": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 3,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.06
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 7,
"unit": "px"
},
"blur": {
"value": 14,
"unit": "px"
},
"spread": {
"value": -5,
"unit": "px"
}
}
]
},
"3": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.03
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -1,
"unit": "px"
},
"blur": {
"value": 3,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.03
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 1,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": -5,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.05
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 2,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": -5,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.06
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 4,
"unit": "px"
},
"blur": {
"value": 12,
"unit": "px"
},
"spread": {
"value": -5,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.08
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 12,
"unit": "px"
},
"blur": {
"value": 15,
"unit": "px"
},
"spread": {
"value": -5,
"unit": "px"
}
}
]
},
"4": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.03
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -2,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 1,
"unit": "px"
},
"blur": {
"value": 1,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 2,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.05
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 5,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.06
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 9,
"unit": "px"
},
"blur": {
"value": 9,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.07
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 16,
"unit": "px"
},
"blur": {
"value": 16,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
}
]
},
"5": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.03
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -1,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 2,
"unit": "px"
},
"blur": {
"value": 1,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 5,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.05
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 10,
"unit": "px"
},
"blur": {
"value": 10,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.06
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 20,
"unit": "px"
},
"blur": {
"value": 20,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.08
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 40,
"unit": "px"
},
"blur": {
"value": 40,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
}
]
},
"6": {
"$type": "shadow",
"$value": [
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.03
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": -1,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": 0,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 3,
"unit": "px"
},
"blur": {
"value": 2,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.04
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 7,
"unit": "px"
},
"blur": {
"value": 5,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.05
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 12,
"unit": "px"
},
"blur": {
"value": 10,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.06
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 22,
"unit": "px"
},
"blur": {
"value": 18,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.07
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 41,
"unit": "px"
},
"blur": {
"value": 33,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
},
{
"color": {
"colorSpace": "hsl",
"components": [
220,
3,
15
],
"alpha": 0.08
},
"offsetX": {
"value": 0,
"unit": "px"
},
"offsetY": {
"value": 100,
"unit": "px"
},
"blur": {
"value": 80,
"unit": "px"
},
"spread": {
"value": -2,
"unit": "px"
}
}
]
}
},
"radius": {
"1": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "px"
}
},
"2": {
"$type": "dimension",
"$value": {
"value": 5,
"unit": "px"
}
},
"3": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
}
},
"4": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
}
},
"5": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "rem"
}
},
"6": {
"$type": "dimension",
"$value": {
"value": 8,
"unit": "rem"
}
},
"round": {
"$type": "dimension",
"$value": {
"value": 100000,
"unit": "px"
}
}
},
"border": {
"size-5": {
"$type": "dimension",
"$value": {
"value": 25,
"unit": "px"
}
},
"size-4": {
"$type": "dimension",
"$value": {
"value": 10,
"unit": "px"
}
},
"size-3": {
"$type": "dimension",
"$value": {
"value": 5,
"unit": "px"
}
},
"size-2": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "px"
}
},
"size-1": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "px"
}
}
},
"ratio": {
"golden": {
"$type": "number",
"$description": "1.6180/1",
"$value": 1.618
},
"ultrawide": {
"$type": "number",
"$description": "18/5",
"$value": 3.6
},
"widescreen": {
"$type": "number",
"$description": "16/9",
"$value": 1.7777777777777777
},
"portrait": {
"$type": "number",
"$description": "3/4",
"$value": 0.75
},
"landscape": {
"$type": "number",
"$description": "4/3",
"$value": 1.3333333333333333
},
"square": {
"$type": "number",
"$value": 1
}
},
"layer": {
"1": {
"$type": "number",
"$value": 1
},
"2": {
"$type": "number",
"$value": 2
},
"3": {
"$type": "number",
"$value": 3
},
"4": {
"$type": "number",
"$value": 4
},
"5": {
"$type": "number",
"$value": 5
},
"important": {
"$type": "number",
"$value": 2147483647
}
},
"ease": {
"1": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
0.5,
1
]
},
"2": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
0.4,
1
]
},
"3": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
0.3,
1
]
},
"4": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
0.2,
1
]
},
"5": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
0.1,
1
]
},
"sine-out": {
"$type": "cubicBezier",
"$value": [
0.39,
0.575,
0.565,
1
]
},
"sine-in-out": {
"$type": "cubicBezier",
"$value": [
0.445,
0.05,
0.55,
0.95
]
},
"sine-in": {
"$type": "cubicBezier",
"$value": [
0.47,
0,
0.745,
0.715
]
},
"quint-out": {
"$type": "cubicBezier",
"$value": [
0.23,
1,
0.32,
1
]
},
"quint-in-out": {
"$type": "cubicBezier",
"$value": [
0.86,
0,
0.07,
1
]
},
"quint-in": {
"$type": "cubicBezier",
"$value": [
0.755,
0.05,
0.855,
0.06
]
},
"quart-out": {
"$type": "cubicBezier",
"$value": [
0.165,
0.84,
0.44,
1
]
},
"quart-in-out": {
"$type": "cubicBezier",
"$value": [
0.77,
0,
0.175,
1
]
},
"quart-in": {
"$type": "cubicBezier",
"$value": [
0.895,
0.03,
0.685,
0.22
]
},
"quad-out": {
"$type": "cubicBezier",
"$value": [
0.25,
0.46,
0.45,
0.94
]
},
"quad-in-out": {
"$type": "cubicBezier",
"$value": [
0.455,
0.03,
0.515,
0.955
]
},
"quad-in": {
"$type": "cubicBezier",
"$value": [
0.55,
0.085,
0.68,
0.53
]
},
"expo-out": {
"$type": "cubicBezier",
"$value": [
0.19,
1,
0.22,
1
]
},
"expo-in-out": {
"$type": "cubicBezier",
"$value": [
1,
0,
0,
1
]
},
"expo-in": {
"$type": "cubicBezier",
"$value": [
0.95,
0.05,
0.795,
0.035
]
},
"cubic-out": {
"$type": "cubicBezier",
"$value": [
0.215,
0.61,
0.355,
1
]
},
"cubic-in-out": {
"$type": "cubicBezier",
"$value": [
0.645,
0.045,
0.355,
1
]
},
"cubic-in": {
"$type": "cubicBezier",
"$value": [
0.55,
0.055,
0.675,
0.19
]
},
"circ-out": {
"$type": "cubicBezier",
"$value": [
0.075,
0.82,
0.165,
1
]
},
"circ-in-out": {
"$type": "cubicBezier",
"$value": [
0.785,
0.135,
0.15,
0.86
]
},
"circ-in": {
"$type": "cubicBezier",
"$value": [
0.6,
0.04,
0.98,
0.335
]
},
"squish-5": {
"$value": "{ease.elastic-in-out-5}"
},
"squish-4": {
"$value": "{ease.elastic-in-out-4}"
},
"squish-3": {
"$value": "{ease.elastic-in-out-3}"
},
"squish-2": {
"$value": "{ease.elastic-in-out-2}"
},
"squish-1": {
"$value": "{ease.elastic-in-out-1}"
},
"elastic-5": {
"$value": "{ease.elastic-out-5}"
},
"elastic-4": {
"$value": "{ease.elastic-out-4}"
},
"elastic-3": {
"$value": "{ease.elastic-out-3}"
},
"elastic-2": {
"$value": "{ease.elastic-out-2}"
},
"elastic-1": {
"$value": "{ease.elastic-out-1}"
},
"elastic-in-out-5": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.9,
0.1,
1.5
]
},
"elastic-in-out-4": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.7,
0.1,
1.5
]
},
"elastic-in-out-3": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.5,
0.1,
1.5
]
},
"elastic-in-out-2": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.3,
0.1,
1.5
]
},
"elastic-in-out-1": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.1,
0.1,
1.5
]
},
"elastic-in-5": {
"$type": "cubicBezier",
"$value": [
0.5,
-1.25,
0.75,
1
]
},
"elastic-in-4": {
"$type": "cubicBezier",
"$value": [
0.5,
-1,
0.75,
1
]
},
"elastic-in-3": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.75,
0.75,
1
]
},
"elastic-in-2": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.5,
0.75,
1
]
},
"elastic-in-1": {
"$type": "cubicBezier",
"$value": [
0.5,
-0.25,
0.75,
1
]
},
"elastic-out-5": {
"$type": "cubicBezier",
"$value": [
0.5,
1.75,
0.75,
1.25
]
},
"elastic-out-4": {
"$type": "cubicBezier",
"$value": [
0.5,
1.5,
0.75,
1.25
]
},
"elastic-out-3": {
"$type": "cubicBezier",
"$value": [
0.5,
1.25,
0.75,
1.25
]
},
"elastic-out-2": {
"$type": "cubicBezier",
"$value": [
0.5,
1,
0.75,
1.25
]
},
"elastic-out-1": {
"$type": "cubicBezier",
"$value": [
0.5,
0.75,
0.75,
1.25
]
},
"in-out-5": {
"$type": "cubicBezier",
"$value": [
0.9,
0,
0.1,
1
]
},
"in-out-4": {
"$type": "cubicBezier",
"$value": [
0.7,
0,
0.3,
1
]
},
"in-out-3": {
"$type": "cubicBezier",
"$value": [
0.5,
0,
0.5,
1
]
},
"in-out-2": {
"$type": "cubicBezier",
"$value": [
0.3,
0,
0.7,
1
]
},
"in-out-1": {
"$type": "cubicBezier",
"$value": [
0.1,
0,
0.9,
1
]
},
"out-5": {
"$type": "cubicBezier",
"$value": [
0,
0,
0,
1
]
},
"out-4": {
"$type": "cubicBezier",
"$value": [
0,
0,
0.1,
1
]
},
"out-3": {
"$type": "cubicBezier",
"$value": [
0,
0,
0.3,
1
]
},
"out-2": {
"$type": "cubicBezier",
"$value": [
0,
0,
0.5,
1
]
},
"out-1": {
"$type": "cubicBezier",
"$value": [
0,
0,
0.75,
1
]
},
"in-5": {
"$type": "cubicBezier",
"$value": [
1,
0,
1,
1
]
},
"in-4": {
"$type": "cubicBezier",
"$value": [
0.9,
0,
1,
1
]
},
"in-3": {
"$type": "cubicBezier",
"$value": [
0.7,
0,
1,
1
]
},
"in-2": {
"$type": "cubicBezier",
"$value": [
0.5,
0,
1,
1
]
},
"in-1": {
"$type": "cubicBezier",
"$value": [
0.25,
0,
1,
1
]
}
},
"size": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.25,
"unit": "rem"
}
},
"2": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
}
},
"3": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
}
},
"4": {
"$type": "dimension",
"$value": {
"value": 1.25,
"unit": "rem"
}
},
"5": {
"$type": "dimension",
"$value": {
"value": 1.5,
"unit": "rem"
}
},
"6": {
"$type": "dimension",
"$value": {
"value": 1.75,
"unit": "rem"
}
},
"7": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
}
},
"8": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "rem"
}
},
"9": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "rem"
}
},
"10": {
"$type": "dimension",
"$value": {
"value": 5,
"unit": "rem"
}
},
"11": {
"$type": "dimension",
"$value": {
"value": 7.5,
"unit": "rem"
}
},
"12": {
"$type": "dimension",
"$value": {
"value": 10,
"unit": "rem"
}
},
"13": {
"$type": "dimension",
"$value": {
"value": 15,
"unit": "rem"
}
},
"14": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "rem"
}
},
"15": {
"$type": "dimension",
"$value": {
"value": 30,
"unit": "rem"
}
},
"xxl": {
"$type": "dimension",
"$value": {
"value": 1920,
"unit": "px"
}
},
"xl": {
"$type": "dimension",
"$value": {
"value": 1440,
"unit": "px"
}
},
"lg": {
"$type": "dimension",
"$value": {
"value": 1024,
"unit": "px"
}
},
"md": {
"$type": "dimension",
"$value": {
"value": 768,
"unit": "px"
}
},
"sm": {
"$type": "dimension",
"$value": {
"value": 480,
"unit": "px"
}
},
"xs": {
"$type": "dimension",
"$value": {
"value": 360,
"unit": "px"
}
},
"xxs": {
"$type": "dimension",
"$value": {
"value": 240,
"unit": "px"
}
},
"px-15": {
"$type": "dimension",
"$value": {
"value": 480,
"unit": "px"
}
},
"px-14": {
"$type": "dimension",
"$value": {
"value": 320,
"unit": "px"
}
},
"px-13": {
"$type": "dimension",
"$value": {
"value": 240,
"unit": "px"
}
},
"px-12": {
"$type": "dimension",
"$value": {
"value": 160,
"unit": "px"
}
},
"px-11": {
"$type": "dimension",
"$value": {
"value": 120,
"unit": "px"
}
},
"px-10": {
"$type": "dimension",
"$value": {
"value": 80,
"unit": "px"
}
},
"px-9": {
"$type": "dimension",
"$value": {
"value": 64,
"unit": "px"
}
},
"px-8": {
"$type": "dimension",
"$value": {
"value": 48,
"unit": "px"
}
},
"px-7": {
"$type": "dimension",
"$value": {
"value": 32,
"unit": "px"
}
},
"px-6": {
"$type": "dimension",
"$value": {
"value": 28,
"unit": "px"
}
},
"px-5": {
"$type": "dimension",
"$value": {
"value": 24,
"unit": "px"
}
},
"px-4": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "px"
}
},
"px-3": {
"$type": "dimension",
"$value": {
"value": 16,
"unit": "px"
}
},
"px-2": {
"$type": "dimension",
"$value": {
"value": 8,
"unit": "px"
}
},
"px-1": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "px"
}
},
"px-00": {
"$type": "dimension",
"$value": {
"value": -4,
"unit": "px"
}
},
"px-000": {
"$type": "dimension",
"$value": {
"value": -8,
"unit": "px"
}
},
"00": {
"$type": "dimension",
"$value": {
"value": -0.25,
"unit": "rem"
}
},
"000": {
"$type": "dimension",
"$value": {
"value": -0.5,
"unit": "rem"
}
}
},
"font": {
"size-8": {
"$type": "dimension",
"$value": {
"value": 3.5,
"unit": "rem"
}
},
"size-7": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "rem"
}
},
"size-6": {
"$type": "dimension",
"$value": {
"value": 2.5,
"unit": "rem"
}
},
"size-5": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
}
},
"size-4": {
"$type": "dimension",
"$value": {
"value": 1.5,
"unit": "rem"
}
},
"size-3": {
"$type": "dimension",
"$value": {
"value": 1.25,
"unit": "rem"
}
},
"size-2": {
"$type": "dimension",
"$value": {
"value": 1.1,
"unit": "rem"
}
},
"size-1": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
}
},
"size-0": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
}
},
"size-00": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
}
},
"letterspacing-7": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
}
},
"letterspacing-6": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
}
},
"letterspacing-5": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
}
},
"letterspacing-4": {
"$type": "dimension",
"$value": {
"value": 0.15,
"unit": "rem"
}
},
"letterspacing-3": {
"$type": "dimension",
"$value": {
"value": 0.075,
"unit": "rem"
}
},
"letterspacing-2": {
"$type": "dimension",
"$value": {
"value": 0.05,
"unit": "rem"
}
},
"letterspacing-1": {
"$type": "dimension",
"$value": {
"value": 0.025,
"unit": "rem"
}
},
"letterspacing-0": {
"$type": "dimension",
"$value": {
"value": -0.05,
"unit": "rem"
}
},
"lineheight-5": {
"$type": "number",
"$value": 2
},
"lineheight-4": {
"$type": "number",
"$value": 1.75
},
"lineheight-3": {
"$type": "number",
"$value": 1.5
},
"lineheight-2": {
"$type": "number",
"$value": 1.375
},
"lineheight-1": {
"$type": "number",
"$value": 1.25
},
"lineheight-0": {
"$type": "number",
"$value": 1.1
},
"lineheight-00": {
"$type": "number",
"$value": 0.95
},
"weight-9": {
"$type": "fontWeight",
"$value": 900
},
"weight-8": {
"$type": "fontWeight",
"$value": 800
},
"weight-7": {
"$type": "fontWeight",
"$value": 700
},
"weight-6": {
"$type": "fontWeight",
"$value": 600
},
"weight-5": {
"$type": "fontWeight",
"$value": 500
},
"weight-4": {
"$type": "fontWeight",
"$value": 400
},
"weight-3": {
"$type": "fontWeight",
"$value": 300
},
"weight-2": {
"$type": "fontWeight",
"$value": 200
},
"weight-1": {
"$type": "fontWeight",
"$value": 100
},
"mono": {
"$value": "{font.monospace-code}"
},
"serif": {
"$type": "fontFamily",
"$value": [
"ui-serif",
"serif"
]
},
"sans": {
"$value": "{font.system-ui}"
},
"handwritten": {
"$type": "fontFamily",
"$value": [
"Segoe Print",
"Bradley Hand",
"Chilanka",
"TSCu_Comic",
"casual",
"cursive"
]
},
"didone": {
"$type": "fontFamily",
"$value": [
"Didot",
"Bodoni MT",
"Noto Serif Display",
"URW Palladio L",
"P052",
"Sylfaen",
"serif"
]
},
"antique": {
"$type": "fontFamily",
"$value": [
"Superclarendon",
"Bookman Old Style",
"URW Bookman",
"URW Bookman L",
"Georgia Pro",
"Georgia",
"serif"
]
},
"slab-serif": {
"$type": "fontFamily",
"$value": [
"Rockwell",
"Rockwell Nova",
"Roboto Slab",
"DejaVu Serif",
"Sitka Small",
"serif"
]
},
"rounded-sans": {
"$type": "fontFamily",
"$value": [
"ui-rounded",
"Hiragino Maru Gothic ProN",
"Quicksand",
"Comfortaa",
"Manjari",
"Arial Rounded MT",
"Arial Rounded MT Bold",
"Calibri",
"source-sans-pro",
"sans-serif"
]
},
"industrial": {
"$type": "fontFamily",
"$value": [
"Bahnschrift",
"DIN Alternate",
"Franklin Gothic Medium",
"Nimbus Sans Narrow",
"sans-serif-condensed",
"sans-serif"
]
},
"monospace-code": {
"$type": "fontFamily",
"$value": [
"Dank Mono",
"Operator Mono",
"Inconsolata",
"Fira Mono",
"ui-monospace",
"SF Mono",
"Monaco",
"Droid Sans Mono",
"Source Code Pro",
"Cascadia Code",
"Menlo",
"Consolas",
"DejaVu Sans Mono",
"monospace"
]
},
"monospace-slab-serif": {
"$type": "fontFamily",
"$value": [
"Nimbus Mono PS",
"Courier New",
"monospace"
]
},
"neo-grotesque": {
"$type": "fontFamily",
"$value": [
"Inter",
"Roboto",
"Helvetica Neue",
"Arial Nova",
"Nimbus Sans",
"Arial",
"sans-serif"
]
},
"classical-humanist": {
"$type": "fontFamily",
"$value": [
"Optima",
"Candara",
"Noto Sans",
"source-sans-pro",
"sans-serif"
]
},
"geometric-humanist": {
"$type": "fontFamily",
"$value": [
"Avenir",
"Montserrat",
"Corbel",
"URW Gothic",
"source-sans-pro",
"sans-serif"
]
},
"humanist": {
"$type": "fontFamily",
"$value": [
"Seravek",
"Gill Sans Nova",
"Ubuntu",
"Calibri",
"DejaVu Sans",
"source-sans-pro",
"sans-serif"
]
},
"old-style": {
"$type": "fontFamily",
"$value": [
"Iowan Old Style",
"Palatino Linotype",
"URW Palladio L",
"P052",
"serif"
]
},
"transitional": {
"$type": "fontFamily",
"$value": [
"Charter",
"Bitstream Charter",
"Sitka Text",
"Cambria",
"serif"
]
},
"system-ui": {
"$type": "fontFamily",
"$value": [
"system-ui",
"sans-serif"
]
}
},
"jungle": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9254901960784314,
0.996078431372549,
0.6901960784313725
],
"hex": "#ecfeb0"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8705882352941177,
0.9529411764705882,
0.6039215686274509
],
"hex": "#def39a"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8156862745098039,
0.9098039215686274,
0.5176470588235295
],
"hex": "#d0e884"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7607843137254902,
0.8666666666666667,
0.43137254901960786
],
"hex": "#c2dd6e"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7098039215686275,
0.8196078431372549,
0.3568627450980392
],
"hex": "#b5d15b"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6588235294117647,
0.7764705882352941,
0.2823529411764706
],
"hex": "#a8c648"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6078431372549019,
0.7333333333333333,
0.21176470588235294
],
"hex": "#9bbb36"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5607843137254902,
0.6901960784313725,
0.1411764705882353
],
"hex": "#8fb024"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5176470588235295,
0.6470588235294118,
0.07450980392156863
],
"hex": "#84a513"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.47843137254901963,
0.6,
0.03137254901960784
],
"hex": "#7a9908"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.396078431372549,
0.5019607843137255,
0.023529411764705882
],
"hex": "#658006"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3176470588235294,
0.4,
0.0196078431372549
],
"hex": "#516605"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.23921568627450981,
0.30196078431372547,
0.01568627450980392
],
"hex": "#3d4d04"
}
}
},
"camo": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9764705882352941,
0.984313725490196,
0.9058823529411765
],
"hex": "#f9fbe7"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9098039215686274,
0.9294117647058824,
0.611764705882353
],
"hex": "#e8ed9c"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8235294117647058,
0.8745098039215686,
0.3058823529411765
],
"hex": "#d2df4e"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7607843137254902,
0.807843137254902,
0.20392156862745098
],
"hex": "#c2ce34"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7098039215686275,
0.7333333333333333,
0.1803921568627451
],
"hex": "#b5bb2e"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6549019607843137,
0.6588235294117647,
0.15294117647058825
],
"hex": "#a7a827"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6,
0.5882352941176471,
0.12941176470588237
],
"hex": "#999621"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5490196078431373,
0.5215686274509804,
0.10980392156862745
],
"hex": "#8c851c"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.49411764705882355,
0.4549019607843137,
0.08627450980392157
],
"hex": "#7e7416"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.42745098039215684,
0.39215686274509803,
0.0784313725490196
],
"hex": "#6d6414"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.36470588235294116,
0.32941176470588235,
0.06666666666666667
],
"hex": "#5d5411"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.30196078431372547,
0.27450980392156865,
0.054901960784313725
],
"hex": "#4d460e"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.21176470588235294,
0.18823529411764706,
0.0392156862745098
],
"hex": "#36300a"
}
}
},
"sand": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9725490196078431,
0.9803921568627451,
0.984313725490196
],
"hex": "#f8fafb"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9019607843137255,
0.8941176470588236,
0.8627450980392157
],
"hex": "#e6e4dc"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8352941176470589,
0.8117647058823529,
0.7411764705882353
],
"hex": "#d5cfbd"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7607843137254902,
0.7254901960784313,
0.6274509803921569
],
"hex": "#c2b9a0"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6823529411764706,
0.6470588235294118,
0.5490196078431373
],
"hex": "#aea58c"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6039215686274509,
0.5686274509803921,
0.47058823529411764
],
"hex": "#9a9178"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5254901960784314,
0.48627450980392156,
0.396078431372549
],
"hex": "#867c65"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.45098039215686275,
0.41568627450980394,
0.3254901960784314
],
"hex": "#736a53"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.37254901960784315,
0.3411764705882353,
0.27450980392156865
],
"hex": "#5f5746"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.29411764705882354,
0.27450980392156865,
0.2235294117647059
],
"hex": "#4b4639"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.2196078431372549,
0.20784313725490197,
0.17647058823529413
],
"hex": "#38352d"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.1450980392156863,
0.1450980392156863,
0.12941176470588237
],
"hex": "#252521"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.07058823529411765,
0.07058823529411765,
0.06274509803921569
],
"hex": "#121210"
}
}
},
"brown": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9803921568627451,
0.9568627450980393,
0.9215686274509803
],
"hex": "#faf4eb"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9294117647058824,
0.8784313725490196,
0.8196078431372549
],
"hex": "#ede0d1"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8784313725490196,
0.792156862745098,
0.7176470588235294
],
"hex": "#e0cab7"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8274509803921568,
0.7176470588235294,
0.6196078431372549
],
"hex": "#d3b79e"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7725490196078432,
0.6352941176470588,
0.5215686274509804
],
"hex": "#c5a285"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7176470588235294,
0.5607843137254902,
0.42745098039215684
],
"hex": "#b78f6d"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6588235294117647,
0.48627450980392156,
0.33725490196078434
],
"hex": "#a87c56"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5843137254901961,
0.4196078431372549,
0.2784313725490196
],
"hex": "#956b47"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5098039215686274,
0.3568627450980392,
0.22745098039215686
],
"hex": "#825b3a"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.43529411764705883,
0.29411764705882354,
0.17647058823529413
],
"hex": "#6f4b2d"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3686274509803922,
0.22745098039215686,
0.12941176470588237
],
"hex": "#5e3a21"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3058823529411765,
0.16862745098039217,
0.08235294117647059
],
"hex": "#4e2b15"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.25882352941176473,
0.1411764705882353,
0.07058823529411765
],
"hex": "#422412"
}
}
},
"choco": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9725490196078431,
0.8627450980392157
],
"hex": "#fff8dc"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9882352941176471,
0.8823529411764706,
0.7372549019607844
],
"hex": "#fce1bc"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9686274509803922,
0.792156862745098,
0.6196078431372549
],
"hex": "#f7ca9e"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9450980392156862,
0.6980392156862745,
0.5019607843137255
],
"hex": "#f1b280"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9137254901960784,
0.6078431372549019,
0.3843137254901961
],
"hex": "#e99b62"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8745098039215686,
0.5215686274509804,
0.27058823529411763
],
"hex": "#df8545"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8313725490196079,
0.43137254901960786,
0.1450980392156863
],
"hex": "#d46e25"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7411764705882353,
0.37254901960784315,
0.10588235294117647
],
"hex": "#bd5f1b"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6431372549019608,
0.3176470588235294,
0.09019607843137255
],
"hex": "#a45117"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5411764705882353,
0.27058823529411763,
0.07450980392156863
],
"hex": "#8a4513"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4392156862745098,
0.22745098039215686,
0.07450980392156863
],
"hex": "#703a13"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3411764705882353,
0.1843137254901961,
0.07058823529411765
],
"hex": "#572f12"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.23921568627450981,
0.12941176470588237,
0.050980392156862744
],
"hex": "#3d210d"
}
}
},
"orange": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9568627450980393,
0.9019607843137255
],
"hex": "#fff4e6"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9098039215686274,
0.8
],
"hex": "#ffe8cc"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.8470588235294118,
0.6588235294117647
],
"hex": "#ffd8a8"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.7529411764705882,
0.47058823529411764
],
"hex": "#ffc078"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.6627450980392157,
0.30196078431372547
],
"hex": "#ffa94d"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.5725490196078431,
0.16862745098039217
],
"hex": "#ff922b"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9921568627450981,
0.49411764705882355,
0.0784313725490196
],
"hex": "#fd7e14"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9686274509803922,
0.403921568627451,
0.027450980392156862
],
"hex": "#f76707"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9098039215686274,
0.34901960784313724,
0.047058823529411764
],
"hex": "#e8590c"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8509803921568627,
0.2823529411764706,
0.058823529411764705
],
"hex": "#d9480f"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7490196078431373,
0.25098039215686274,
0.050980392156862744
],
"hex": "#bf400d"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6,
0.2,
0.043137254901960784
],
"hex": "#99330b"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5019607843137255,
0.16862745098039217,
0.03529411764705882
],
"hex": "#802b09"
}
}
},
"yellow": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9764705882352941,
0.8588235294117647
],
"hex": "#fff9db"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9529411764705882,
0.7490196078431373
],
"hex": "#fff3bf"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9254901960784314,
0.6
],
"hex": "#ffec99"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.8784313725490196,
0.4
],
"hex": "#ffe066"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.8313725490196079,
0.23137254901960785
],
"hex": "#ffd43b"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9882352941176471,
0.7686274509803922,
0.09803921568627451
],
"hex": "#fcc419"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9803921568627451,
0.6901960784313725,
0.0196078431372549
],
"hex": "#fab005"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9607843137254902,
0.6235294117647059,
0
],
"hex": "#f59f00"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9411764705882353,
0.5490196078431373,
0
],
"hex": "#f08c00"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9019607843137255,
0.4666666666666667,
0
],
"hex": "#e67700"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7019607843137254,
0.3607843137254902,
0
],
"hex": "#b35c00"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5019607843137255,
0.25882352941176473,
0
],
"hex": "#804200"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4,
0.20784313725490197,
0
],
"hex": "#663500"
}
}
},
"lime": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9568627450980393,
0.9882352941176471,
0.8901960784313725
],
"hex": "#f4fce3"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9137254901960784,
0.9803921568627451,
0.7843137254901961
],
"hex": "#e9fac8"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8470588235294118,
0.9607843137254902,
0.6352941176470588
],
"hex": "#d8f5a2"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7529411764705882,
0.9215686274509803,
0.4588235294117647
],
"hex": "#c0eb75"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6627450980392157,
0.8901960784313725,
0.29411764705882354
],
"hex": "#a9e34b"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5803921568627451,
0.8470588235294118,
0.17647058823529413
],
"hex": "#94d82d"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5098039215686274,
0.788235294117647,
0.11764705882352941
],
"hex": "#82c91e"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4549019607843137,
0.7215686274509804,
0.08627450980392157
],
"hex": "#74b816"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4,
0.6588235294117647,
0.058823529411764705
],
"hex": "#66a80f"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3607843137254902,
0.5803921568627451,
0.050980392156862744
],
"hex": "#5c940d"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.2980392156862745,
0.47843137254901963,
0.043137254901960784
],
"hex": "#4c7a0b"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.23529411764705882,
0.3803921568627451,
0.03529411764705882
],
"hex": "#3c6109"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.17254901960784313,
0.2784313725490196,
0.023529411764705882
],
"hex": "#2c4706"
}
}
},
"green": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9215686274509803,
0.984313725490196,
0.9333333333333333
],
"hex": "#ebfbee"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8274509803921568,
0.9764705882352941,
0.8470588235294118
],
"hex": "#d3f9d8"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6980392156862745,
0.9490196078431372,
0.7333333333333333
],
"hex": "#b2f2bb"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5490196078431373,
0.9137254901960784,
0.6039215686274509
],
"hex": "#8ce99a"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4117647058823529,
0.8588235294117647,
0.48627450980392156
],
"hex": "#69db7c"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3176470588235294,
0.8117647058823529,
0.4
],
"hex": "#51cf66"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.25098039215686274,
0.7529411764705882,
0.3411764705882353
],
"hex": "#40c057"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.21568627450980393,
0.6980392156862745,
0.30196078431372547
],
"hex": "#37b24d"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.1843137254901961,
0.6196078431372549,
0.26666666666666666
],
"hex": "#2f9e44"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.16862745098039217,
0.5411764705882353,
0.24313725490196078
],
"hex": "#2b8a3e"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.13725490196078433,
0.4392156862745098,
0.19607843137254902
],
"hex": "#237032"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.10588235294117647,
0.3411764705882353,
0.15294117647058825
],
"hex": "#1b5727"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.07450980392156863,
0.23921568627450981,
0.10588235294117647
],
"hex": "#133d1b"
}
}
},
"teal": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9019607843137255,
0.9882352941176471,
0.9607843137254902
],
"hex": "#e6fcf5"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7647058823529411,
0.9803921568627451,
0.9098039215686274
],
"hex": "#c3fae8"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5882352941176471,
0.9490196078431372,
0.8431372549019608
],
"hex": "#96f2d7"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.38823529411764707,
0.9019607843137255,
0.7450980392156863
],
"hex": "#63e6be"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.2196078431372549,
0.8509803921568627,
0.6627450980392157
],
"hex": "#38d9a9"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.12549019607843137,
0.788235294117647,
0.592156862745098
],
"hex": "#20c997"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.07058823529411765,
0.7215686274509804,
0.5254901960784314
],
"hex": "#12b886"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.047058823529411764,
0.6509803921568628,
0.47058823529411764
],
"hex": "#0ca678"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.03529411764705882,
0.5725490196078431,
0.40784313725490196
],
"hex": "#099268"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.03137254901960784,
0.4980392156862745,
0.3568627450980392
],
"hex": "#087f5b"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.023529411764705882,
0.4,
0.28627450980392155
],
"hex": "#066649"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.0196078431372549,
0.30196078431372547,
0.21568627450980393
],
"hex": "#054d37"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.011764705882352941,
0.2,
0.1450980392156863
],
"hex": "#033325"
}
}
},
"cyan": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8901960784313725,
0.9803921568627451,
0.9882352941176471
],
"hex": "#e3fafc"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7725490196078432,
0.9647058823529412,
0.9803921568627451
],
"hex": "#c5f6fa"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6,
0.9137254901960784,
0.9490196078431372
],
"hex": "#99e9f2"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4,
0.8509803921568627,
0.9098039215686274
],
"hex": "#66d9e8"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.23137254901960785,
0.788235294117647,
0.8588235294117647
],
"hex": "#3bc9db"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.13333333333333333,
0.7215686274509804,
0.8117647058823529
],
"hex": "#22b8cf"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.08235294117647059,
0.6666666666666666,
0.7490196078431373
],
"hex": "#15aabf"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.06274509803921569,
0.596078431372549,
0.6784313725490196
],
"hex": "#1098ad"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.047058823529411764,
0.5215686274509804,
0.6
],
"hex": "#0c8599"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.043137254901960784,
0.4470588235294118,
0.5215686274509804
],
"hex": "#0b7285"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.03529411764705882,
0.3607843137254902,
0.4196078431372549
],
"hex": "#095c6b"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.027450980392156862,
0.27450980392156865,
0.3215686274509804
],
"hex": "#074652"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.0196078431372549,
0.18823529411764706,
0.2196078431372549
],
"hex": "#053038"
}
}
},
"blue": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9058823529411765,
0.9607843137254902,
1
],
"hex": "#e7f5ff"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8156862745098039,
0.9215686274509803,
1
],
"hex": "#d0ebff"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6470588235294118,
0.8470588235294118,
1
],
"hex": "#a5d8ff"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4549019607843137,
0.7529411764705882,
0.9882352941176471
],
"hex": "#74c0fc"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.30196078431372547,
0.6705882352941176,
0.9686274509803922
],
"hex": "#4dabf7"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.2,
0.6039215686274509,
0.9411764705882353
],
"hex": "#339af0"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.13333333333333333,
0.5450980392156862,
0.9019607843137255
],
"hex": "#228be6"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.10980392156862745,
0.49411764705882355,
0.8392156862745098
],
"hex": "#1c7ed6"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.09803921568627451,
0.44313725490196076,
0.7607843137254902
],
"hex": "#1971c2"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.09411764705882353,
0.39215686274509803,
0.6705882352941176
],
"hex": "#1864ab"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.0784313725490196,
0.3333333333333333,
0.5686274509803921
],
"hex": "#145591"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.06666666666666667,
0.27450980392156865,
0.47058823529411764
],
"hex": "#114678"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.050980392156862744,
0.21568627450980393,
0.3686274509803922
],
"hex": "#0d375e"
}
}
},
"indigo": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9294117647058824,
0.9490196078431372,
1
],
"hex": "#edf2ff"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8588235294117647,
0.8941176470588236,
1
],
"hex": "#dbe4ff"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7294117647058823,
0.7843137254901961,
1
],
"hex": "#bac8ff"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5686274509803921,
0.6549019607843137,
1
],
"hex": "#91a7ff"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4549019607843137,
0.5607843137254902,
0.9882352941176471
],
"hex": "#748ffc"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3607843137254902,
0.48627450980392156,
0.9803921568627451
],
"hex": "#5c7cfa"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.2980392156862745,
0.43137254901960786,
0.9607843137254902
],
"hex": "#4c6ef5"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.25882352941176473,
0.38823529411764707,
0.9215686274509803
],
"hex": "#4263eb"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.23137254901960785,
0.3568627450980392,
0.8588235294117647
],
"hex": "#3b5bdb"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.21176470588235294,
0.30980392156862746,
0.7803921568627451
],
"hex": "#364fc7"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.1843137254901961,
0.26666666666666666,
0.6784313725490196
],
"hex": "#2f44ad"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.1568627450980392,
0.22745098039215686,
0.5803921568627451
],
"hex": "#283a94"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.12941176470588237,
0.18823529411764706,
0.47843137254901963
],
"hex": "#21307a"
}
}
},
"violet": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9529411764705882,
0.9411764705882353,
1
],
"hex": "#f3f0ff"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8980392156862745,
0.8588235294117647,
1
],
"hex": "#e5dbff"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8156862745098039,
0.7490196078431373,
1
],
"hex": "#d0bfff"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6941176470588235,
0.592156862745098,
0.9882352941176471
],
"hex": "#b197fc"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.592156862745098,
0.4588235294117647,
0.9803921568627451
],
"hex": "#9775fa"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5176470588235295,
0.3686274509803922,
0.9686274509803922
],
"hex": "#845ef7"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4745098039215686,
0.3137254901960784,
0.9490196078431372
],
"hex": "#7950f2"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4392156862745098,
0.2823529411764706,
0.9098039215686274
],
"hex": "#7048e8"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.403921568627451,
0.2549019607843137,
0.8509803921568627
],
"hex": "#6741d9"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.37254901960784315,
0.23921568627450981,
0.7686274509803922
],
"hex": "#5f3dc4"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3215686274509804,
0.20784313725490197,
0.6705882352941176
],
"hex": "#5235ab"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.27450980392156865,
0.17647058823529413,
0.5686274509803921
],
"hex": "#462d91"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.22745098039215686,
0.1450980392156863,
0.47058823529411764
],
"hex": "#3a2578"
}
}
},
"purple": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9725490196078431,
0.9411764705882353,
0.9882352941176471
],
"hex": "#f8f0fc"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9529411764705882,
0.8509803921568627,
0.9803921568627451
],
"hex": "#f3d9fa"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9333333333333333,
0.7450980392156863,
0.9803921568627451
],
"hex": "#eebefa"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8980392156862745,
0.6,
0.9686274509803922
],
"hex": "#e599f7"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8549019607843137,
0.4666666666666667,
0.9490196078431372
],
"hex": "#da77f2"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8,
0.36470588235294116,
0.9098039215686274
],
"hex": "#cc5de8"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7450980392156863,
0.29411764705882354,
0.8588235294117647
],
"hex": "#be4bdb"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6823529411764706,
0.24313725490196078,
0.788235294117647
],
"hex": "#ae3ec9"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.611764705882353,
0.21176470588235294,
0.7098039215686275
],
"hex": "#9c36b5"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5254901960784314,
0.1803921568627451,
0.611764705882353
],
"hex": "#862e9c"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4392156862745098,
0.14901960784313725,
0.5098039215686274
],
"hex": "#702682"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.35294117647058826,
0.11764705882352941,
0.4117647058823529
],
"hex": "#5a1e69"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.26666666666666666,
0.09019607843137255,
0.30980392156862746
],
"hex": "#44174f"
}
}
},
"pink": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9411764705882353,
0.9647058823529412
],
"hex": "#fff0f6"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.8705882352941177,
0.9215686274509803
],
"hex": "#ffdeeb"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9882352941176471,
0.7607843137254902,
0.8431372549019608
],
"hex": "#fcc2d7"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9803921568627451,
0.6352941176470588,
0.7568627450980392
],
"hex": "#faa2c1"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9686274509803922,
0.5137254901960784,
0.6745098039215687
],
"hex": "#f783ac"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9411764705882353,
0.396078431372549,
0.5843137254901961
],
"hex": "#f06595"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9019607843137255,
0.28627450980392155,
0.5019607843137255
],
"hex": "#e64980"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8392156862745098,
0.2,
0.4235294117647059
],
"hex": "#d6336c"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.7607843137254902,
0.1450980392156863,
0.3607843137254902
],
"hex": "#c2255c"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6509803921568628,
0.11764705882352941,
0.30196078431372547
],
"hex": "#a61e4d"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5490196078431373,
0.09803921568627451,
0.2549019607843137
],
"hex": "#8c1941"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.45098039215686275,
0.08235294117647059,
0.21176470588235294
],
"hex": "#731536"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.34901960784313724,
0.06274509803921569,
0.16470588235294117
],
"hex": "#59102a"
}
}
},
"red": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.9607843137254902,
0.9607843137254902
],
"hex": "#fff5f5"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.8901960784313725,
0.8901960784313725
],
"hex": "#ffe3e3"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.788235294117647,
0.788235294117647
],
"hex": "#ffc9c9"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.6588235294117647,
0.6588235294117647
],
"hex": "#ffa8a8"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.5294117647058824,
0.5294117647058824
],
"hex": "#ff8787"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
1,
0.4196078431372549,
0.4196078431372549
],
"hex": "#ff6b6b"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9803921568627451,
0.3215686274509804,
0.3215686274509804
],
"hex": "#fa5252"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9411764705882353,
0.24313725490196078,
0.24313725490196078
],
"hex": "#f03e3e"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8784313725490196,
0.19215686274509805,
0.19215686274509805
],
"hex": "#e03131"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.788235294117647,
0.16470588235294117,
0.16470588235294117
],
"hex": "#c92a2a"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6901960784313725,
0.1450980392156863,
0.1450980392156863
],
"hex": "#b02525"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5882352941176471,
0.12549019607843137,
0.12549019607843137
],
"hex": "#962020"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.49019607843137253,
0.10196078431372549,
0.10196078431372549
],
"hex": "#7d1a1a"
}
}
},
"stone": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9725490196078431,
0.9803921568627451,
0.984313725490196
],
"hex": "#f8fafb"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9490196078431372,
0.9568627450980393,
0.9647058823529412
],
"hex": "#f2f4f6"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9215686274509803,
0.9294117647058824,
0.9372549019607843
],
"hex": "#ebedef"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8784313725490196,
0.8941176470588236,
0.8980392156862745
],
"hex": "#e0e4e5"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8196078431372549,
0.8392156862745098,
0.8470588235294118
],
"hex": "#d1d6d8"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6941176470588235,
0.7137254901960784,
0.7254901960784313
],
"hex": "#b1b6b9"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.592156862745098,
0.6078431372549019,
0.615686274509804
],
"hex": "#979b9d"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.49411764705882355,
0.5098039215686274,
0.5098039215686274
],
"hex": "#7e8282"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.4,
0.4117647058823529,
0.40784313725490196
],
"hex": "#666968"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.3137254901960784,
0.3176470588235294,
0.30980392156862746
],
"hex": "#50514f"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.22745098039215686,
0.22745098039215686,
0.21568627450980393
],
"hex": "#3a3a37"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.1450980392156863,
0.1450980392156863,
0.12941176470588237
],
"hex": "#252521"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.07058823529411765,
0.07058823529411765,
0.06274509803921569
],
"hex": "#121210"
}
}
},
"gray": {
"0": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9725490196078431,
0.9764705882352941,
0.9803921568627451
],
"hex": "#f8f9fa"
}
},
"1": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9450980392156862,
0.9529411764705882,
0.9607843137254902
],
"hex": "#f1f3f5"
}
},
"2": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.9137254901960784,
0.9254901960784314,
0.9372549019607843
],
"hex": "#e9ecef"
}
},
"3": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.8705882352941177,
0.8862745098039215,
0.9019607843137255
],
"hex": "#dee2e6"
}
},
"4": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.807843137254902,
0.8313725490196079,
0.8549019607843137
],
"hex": "#ced4da"
}
},
"5": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.6784313725490196,
0.7098039215686275,
0.7411764705882353
],
"hex": "#adb5bd"
}
},
"6": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.5254901960784314,
0.5568627450980392,
0.5882352941176471
],
"hex": "#868e96"
}
},
"7": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.28627450980392155,
0.3137254901960784,
0.3411764705882353
],
"hex": "#495057"
}
},
"8": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.20392156862745098,
0.22745098039215686,
0.25098039215686274
],
"hex": "#343a40"
}
},
"9": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.12941176470588237,
0.1450980392156863,
0.1607843137254902
],
"hex": "#212529"
}
},
"10": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.08627450980392157,
0.09803921568627451,
0.11372549019607843
],
"hex": "#16191d"
}
},
"11": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.050980392156862744,
0.058823529411764705,
0.07058823529411765
],
"hex": "#0d0f12"
}
},
"12": {
"$type": "color",
"$value": {
"colorSpace": "srgb",
"components": [
0.011764705882352941,
0.0196078431372549,
0.027450980392156862
],
"hex": "#030507"
}
}
}
}
]
}
]
}

File: package.json

{
"type": "module",
"name": "open-props",
"author": "Adam Argyle",
"license": "MIT",
"version": "1.7.23",
"repository": {
"type": "git",
"url": "git+https://github.com/argyleink/open-props.git"
},
"keywords": [
"css",
"utilities",
"variables",
"custom properties",
"gradients"
],
"style": "open-props.min.css",
"source": "src/index.js",
"main": "dist/open-props.cjs",
"unpkg": "open-props.min.css",
"module": "dist/open-props.module.js",
"types": "dist/open-props.module.d.ts",
"exports": {
".": {
"types": "./dist/open-props.module.d.ts",
"import": "./dist/open-props.module.js",
"require": "./dist/open-props.cjs",
"default": "./dist/open-props.cjs"
},
"./src": {
"types": "./src/index.d.ts",
"default": "./src/index.js"
},
"./src/animations": {
"types": "./src/props.animations.d.ts",
"default": "./src/props.animations.js"
},
"./src/aspects": {
"types": "./src/props.aspects.d.ts",
"default": "./src/props.aspects.js"
},
"./src/borders": {
"types": "./src/props.borders.d.ts",
"default": "./src/props.borders.js"
},
"./src/colors": {
"types": "./src/props.colors.d.ts",
"default": "./src/props.colors.js"
},
"./src/colors-hsl": {
"types": "./src/props.colors-hsl.d.ts",
"default": "./src/props.colors-hsl.js"
},
"./src/easing": {
"types": "./src/props.easing.d.ts",
"default": "./src/props.easing.js"
},
"./src/fonts": {
"types": "./src/props.fonts.d.ts",
"default": "./src/props.fonts.js"
},
"./src/gradients": {
"types": "./src/props.gradients.d.ts",
"default": "./src/props.gradients.js"
},
"./src/media": {
"types": "./src/props.media.d.ts",
"default": "./src/props.media.js"
},
"./src/shadows": {
"types": "./src/props.shadows.d.ts",
"default": "./src/props.shadows.js"
},
"./src/sizes": {
"types": "./src/props.sizes.d.ts",
"default": "./src/props.sizes.js"
},
"./src/svg": {
"types": "./src/props.svg.d.ts",
"default": "./src/props.svg.js"
},
"./src/zindex": {
"types": "./src/props.zindex.d.ts",
"default": "./src/props.zindex.js"
},
"./src/masks.edges": {
"types": "./src/props.masks.edges.d.ts",
"default": "./src/props.masks.edges.js"
},
"./src/masks.corner-cuts": {
"types": "./src/props.masks.corner-cuts.d.ts",
"default": "./src/props.masks.corner-cuts.js"
},
"./src/brand-colors": {
"types": "./src/props.brand-colors.d.ts",
"default": "./src/props.brand-colors.js"
},
"./src/palette": {
"types": "./src/props.palette.d.ts",
"default": "./src/props.palette.js"
},
"./style": "./open-props.min.css",
"./postcss/style": "./src/index.css",
"./normalize": "./normalize.min.css",
"./normalize/light": "./normalize.light.min.css",
"./normalize/dark": "./normalize.dark.min.css",
"./switch/light": "./theme.light.switch.min.css",
"./switch/dark": "./theme.dark.switch.min.css",
"./postcss/normalize": "./src/extra/normalize.css",
"./postcss/normalize/light": "./src/extra/normalize.light.css",
"./postcss/normalize/dark": "./src/extra/normalize.dark.css",
"./buttons": "./buttons.min.css",
"./buttons/light": "./buttons.light.min.css",
"./buttons/dark": "./buttons.dark.min.css",
"./postcss/buttons": "./src/extra/buttons.css",
"./postcss/buttons/light": "./src/extra/buttons.light.css",
"./postcss/buttons/dark": "./src/extra/buttons.dark.css",
"./animations": "./animations.min.css",
"./aspects": "./aspects.min.css",
"./blue": "./blue.min.css",
"./blue-hsl": "./blue-hsl.min.css",
"./borders": "./borders.min.css",
"./brown": "./brown.min.css",
"./brown-hsl": "./brown-hsl.min.css",
"./camo": "./camo.min.css",
"./camo-hsl": "./camo-hsl.min.css",
"./choco": "./choco.min.css",
"./choco-hsl": "./choco-hsl.min.css",
"./colors": "./colors.min.css",
"./colors-hsl": "./colors-hsl.min.css",
"./colors-hd": "./colors-oklch.min.css",
"./oklch-hues": "./oklch-hues.min.css",
"./cyan": "./cyan.min.css",
"./cyan-hsl": "./cyan-hsl.min.css",
"./durations": "./durations.min.css",
"./easings": "./easings.min.css",
"./fonts": "./fonts.min.css",
"./gradients": "./gradients.min.css",
"./gray": "./gray.min.css",
"./gray-hsl": "./gray-hsl.min.css",
"./gray-hd": "./gray-oklch.min.css",
"./green": "./green.min.css",
"./green-hsl": "./green-hsl.min.css",
"./indigo": "./indigo.min.css",
"./indigo-hsl": "./indigo-hsl.min.css",
"./jungle": "./jungle.min.css",
"./jungle-hsl": "./jungle-hsl.min.css",
"./lime": "./lime.min.css",
"./lime-hsl": "./lime-hsl.min.css",
"./masks/edges": "./masks.edges.min.css",
"./masks/corner-cuts": "./masks.corner-cuts.min.css",
"./media": "./media.min.css",
"./palette": "./palette.min.css",
"./orange": "./orange.min.css",
"./orange-hsl": "./orange-hsl.min.css",
"./pink": "./pink.min.css",
"./pink-hsl": "./pink-hsl.min.css",
"./purple": "./purple.min.css",
"./purple-hsl": "./purple-hsl.min.css",
"./red": "./red.min.css",
"./red-hsl": "./red-hsl.min.css",
"./sand": "./sand.min.css",
"./sand-hsl": "./sand-hsl.min.css",
"./shadows": "./shadows.min.css",
"./shadows/light": "./shadows.light.min.css",
"./shadows/dark": "./shadows.dark.min.css",
"./postcss/shadows/light": "./src/props.shadows.light.css",
"./postcss/shadows/dark": "./src/props.shadows.dark.css",
"./sizes": "./sizes.min.css",
"./stone": "./stone.min.css",
"./stone-hsl": "./stone-hsl.min.css",
"./teal": "./teal.min.css",
"./teal-hsl": "./teal-hsl.min.css",
"./violet": "./violet.min.css",
"./violet-hsl": "./violet-hsl.min.css",
"./yellow": "./yellow.min.css",
"./yellow-hsl": "./yellow-hsl.min.css",
"./zindex": "./zindex.min.css",
"./brand-colors": "./brand-colors.min.css",
"./shadow/style": "./open-props.shadow.min.css",
"./shadow/normalize": "./normalize.shadow.min.css",
"./shadow/animations": "./animations.shadow.min.css",
"./shadow/aspects": "./aspects.shadow.min.css",
"./shadow/blue": "./blue.shadow.min.css",
"./shadow/blue-hsl": "./blue-hsl.shadow.min.css",
"./shadow/borders": "./borders.shadow.min.css",
"./shadow/brown": "./brown.shadow.min.css",
"./shadow/brown-hsl": "./brown-hsl.shadow.min.css",
"./shadow/camo": "./camo.shadow.min.css",
"./shadow/camo-hsl": "./camo-hsl.shadow.min.css",
"./shadow/choco": "./choco.shadow.min.css",
"./shadow/choco-hsl": "./choco-hsl.shadow.min.css",
"./shadow/colors": "./colors.shadow.min.css",
"./shadow/colors-hsl": "./colors-hsl.shadow.min.css",
"./shadow/cyan": "./cyan.shadow.min.css",
"./shadow/cyan-hsl": "./cyan-hsl.shadow.min.css",
"./shadow/easings": "./easings.shadow.min.css",
"./shadow/fonts": "./fonts.shadow.min.css",
"./shadow/gradients": "./gradients.shadow.min.css",
"./shadow/gray": "./gray.shadow.min.css",
"./shadow/gray-hsl": "./gray-hsl.shadow.min.css",
"./shadow/green": "./green.shadow.min.css",
"./shadow/green-hsl": "./green-hsl.shadow.min.css",
"./shadow/indigo": "./indigo.shadow.min.css",
"./shadow/indigo-hsl": "./indigo-hsl.shadow.min.css",
"./shadow/jungle": "./jungle.shadow.min.css",
"./shadow/jungle-hsl": "./jungle-hsl.shadow.min.css",
"./shadow/lime": "./lime.shadow.min.css",
"./shadow/lime-hsl": "./lime-hsl.shadow.min.css",
"./shadow/media": "./media.shadow.min.css",
"./shadow/orange": "./orange.shadow.min.css",
"./shadow/orange-hsl": "./orange-hsl.shadow.min.css",
"./shadow/pink": "./pink.shadow.min.css",
"./shadow/pink-hsl": "./pink-hsl.shadow.min.css",
"./shadow/purple": "./purple.shadow.min.css",
"./shadow/purple-hsl": "./purple-hsl.shadow.min.css",
"./shadow/red": "./red.shadow.min.css",
"./shadow/red-hsl": "./red-hsl.shadow.min.css",
"./shadow/sand": "./sand.shadow.min.css",
"./shadow/sand-hsl": "./sand-hsl.shadow.min.css",
"./shadow/shadows": "./shadows.shadow.min.css",
"./shadow/sizes": "./sizes.shadow.min.css",
"./shadow/stone": "./stone.shadow.min.css",
"./shadow/stone-hsl": "./stone-hsl.shadow.min.css",
"./shadow/teal": "./teal.shadow.min.css",
"./shadow/teal-hsl": "./teal-hsl.shadow.min.css",
"./shadow/violet": "./violet.shadow.min.css",
"./shadow/violet-hsl": "./violet-hsl.shadow.min.css",
"./shadow/yellow": "./yellow.shadow.min.css",
"./shadow/yellow-hsl": "./yellow-hsl.shadow.min.css",
"./shadow/zindex": "./zindex.shadow.min.css",
"./resolver": "./open-props.resolver.json",
"./json": "./open-props.tokens.json",
"./tokens": "./open-props.tokens.json",
"./design-tokens": "./open-props.tokens.json",
"./style-dictionary-tokens": "./open-props.style-dictionary-tokens.json",
"./postcss/brand": "./src/extra/brand.css",
"./postcss/theme": "./src/extra/theme.css",
"./postcss/theme-dark": "./src/extra/theme-dark.css",
"./postcss/theme-light": "./src/extra/theme-light.css",
"./utilities": "./src/extra/utilities.css",
"./": "./"
},
"browserslist": [
"defaults"
],
"scripts": {
"build": "concurrently npm:gen:op npm:gen:shadowdom && npm run gen:types",
"test": "ava test/basic.test.cjs",
"changelog": "auto-changelog -p --unreleased",
"bundle": "concurrently npm:lib:* -m 25 && concurrently npm:shadow:* -m 25",
"bundle:sizes": "cd build && node bundle-sizes.js",
"gen:op": "cd build && node props.js "" true",
"gen:nowhere": "cd build && node props "" false",
"gen:shadowdom": "cd build && node props "" false ":host" "shadow"",
"gen:prefixed": "cd build && node props.js "op" true",
"gen:types": "rm -f src/.d.ts dist/.d.ts && tsc -p tsconfig.json",
"lib:all": "postcss src/index.css -o open-props.min.css",
"lib:normalize": "postcss src/extra/normalize.css -o normalize.min.css && node ./build/extras.js",
"lib:normalize:light": "postcss src/extra/normalize.light.css -o normalize.light.min.css",
"lib:normalize:dark": "postcss src/extra/normalize.dark.css -o normalize.dark.min.css",
"lib:switch:light": "postcss src/extra/theme.light.switch.css -o theme.light.switch.min.css",
"lib:switch:dark": "postcss src/extra/theme.dark.switch.css -o theme.dark.switch.min.css",
"lib:buttons": "postcss src/extra/buttons.css -o buttons.min.css",
"lib:buttons:light": "postcss src/extra/buttons.light.css -o buttons.light.min.css",
"lib:buttons:dark": "postcss src/extra/buttons.dark.css -o buttons.dark.min.css",
"lib:animations": "postcss src/props.animations.css -o animations.min.css",
"lib:aspects": "postcss src/props.aspects.css -o aspects.min.css",
"lib:borders": "postcss src/props.borders.css -o borders.min.css",
"lib:durations": "postcss src/extra/durations.css -o durations.min.css",
"lib:easing": "postcss src/props.easing.css -o easings.min.css",
"lib:fonts": "postcss src/props.fonts.css -o fonts.min.css",
"lib:gradients": "postcss src/props.gradients.css -o gradients.min.css",
"lib:media": "postcss src/props.media.css -o media.min.css",
"lib:palette": "postcss src/props.palette.css -o palette.min.css",
"lib:shadows": "postcss src/props.shadows.css -o shadows.min.css",
"lib:shadows:light": "postcss src/props.shadows.light.css -o shadows.light.min.css",
"lib:shadows:dark": "postcss src/props.shadows.dark.css -o shadows.dark.min.css",
"lib:sizes": "postcss src/props.sizes.css -o sizes.min.css",
"lib:supports": "postcss src/props.supports.css -o supports.min.css",
"lib:zindex": "postcss src/props.zindex.css -o zindex.min.css",
"lib:masks:edges": "postcss src/props.masks.edges.css -o masks.edges.min.css",
"lib:masks:cornercuts": "postcss src/props.masks.corner-cuts.css -o masks.corner-cuts.min.css",
"lib:colors": "postcss src/props.colors.css -o colors.min.css",
"lib:colors:oklch-hues": "postcss src/props.colors-oklch-hues.css -o oklch-hues.min.css",
"lib:colors-hsl": "postcss src/props.colors-hsl.css -o colors-hsl.min.css",
"lib:colors-oklch": "postcss src/props.colors-oklch.css -o colors-oklch.min.css",
"lib:colors:gray": "postcss src/props.gray.css -o gray.min.css",
"lib:colors:gray-hsl": "postcss src/props.gray-hsl.css -o gray-hsl.min.css",
"lib:colors:gray-oklch": "postcss src/props.gray-oklch.css -o gray-oklch.min.css",
"lib:colors:stone": "postcss src/props.stone.css -o stone.min.css",
"lib:colors:stone-hsl": "postcss src/props.stone-hsl.css -o stone-hsl.min.css",
"lib:colors:red": "postcss src/props.red.css -o red.min.css",
"lib:colors:red-hsl": "postcss src/props.red-hsl.css -o red-hsl.min.css",
"lib:colors:pink": "postcss src/props.pink.css -o pink.min.css",
"lib:colors:pink-hsl": "postcss src/props.pink-hsl.css -o pink-hsl.min.css",
"lib:colors:purple": "postcss src/props.purple.css -o purple.min.css",
"lib:colors:purple-hsl": "postcss src/props.purple-hsl.css -o purple-hsl.min.css",
"lib:colors:violet": "postcss src/props.violet.css -o violet.min.css",
"lib:colors:violet-hsl": "postcss src/props.violet-hsl.css -o violet-hsl.min.css",
"lib:colors:indigo": "postcss src/props.indigo.css -o indigo.min.css",
"lib:colors:indigo-hsl": "postcss src/props.indigo-hsl.css -o indigo-hsl.min.css",
"lib:colors:blue": "postcss src/props.blue.css -o blue.min.css",
"lib:colors:blue-hsl": "postcss src/props.blue-hsl.css -o blue-hsl.min.css",
"lib:colors:cyan": "postcss src/props.cyan.css -o cyan.min.css",
"lib:colors:cyan-hsl": "postcss src/props.cyan-hsl.css -o cyan-hsl.min.css",
"lib:colors:teal": "postcss src/props.teal.css -o teal.min.css",
"lib:colors:teal-hsl": "postcss src/props.teal-hsl.css -o teal-hsl.min.css",
"lib:colors:green": "postcss src/props.green.css -o green.min.css",
"lib:colors:green-hsl": "postcss src/props.green-hsl.css -o green-hsl.min.css",
"lib:colors:lime": "postcss src/props.lime.css -o lime.min.css",
"lib:colors:lime-hsl": "postcss src/props.lime-hsl.css -o lime-hsl.min.css",
"lib:colors:yellow": "postcss src/props.yellow.css -o yellow.min.css",
"lib:colors:yellow-hsl": "postcss src/props.yellow-hsl.css -o yellow-hsl.min.css",
"lib:colors:orange": "postcss src/props.orange.css -o orange.min.css",
"lib:colors:orange-hsl": "postcss src/props.orange-hsl.css -o orange-hsl.min.css",
"lib:colors:choco": "postcss src/props.choco.css -o choco.min.css",
"lib:colors:choco-hsl": "postcss src/props.choco-hsl.css -o choco-hsl.min.css",
"lib:colors:brown": "postcss src/props.brown.css -o brown.min.css",
"lib:colors:brown-hsl": "postcss src/props.brown-hsl.css -o brown-hsl.min.css",
"lib:colors:sand": "postcss src/props.sand.css -o sand.min.css",
"lib:colors:sand-hsl": "postcss src/props.sand-hsl.css -o sand-hsl.min.css",
"lib:colors:camo": "postcss src/props.camo.css -o camo.min.css",
"lib:colors:camo-hsl": "postcss src/props.camo-hsl.css -o camo-hsl.min.css",
"lib:colors:jungle": "postcss src/props.jungle.css -o jungle.min.css",
"lib:colors:jungle-hsl": "postcss src/props.jungle-hsl.css -o jungle-hsl.min.css",
"shadow:all": "postcss src/shadow.index.css -o open-props.shadow.min.css",
"shadow:animations": "postcss src/shadow.props.animations.css -o animations.shadow.min.css",
"shadow:aspects": "postcss src/shadow.props.aspects.css -o aspects.shadow.min.css",
"shadow:borders": "postcss src/shadow.props.borders.css -o borders.shadow.min.css",
"shadow:easing": "postcss src/shadow.props.easing.css -o easings.shadow.min.css",
"shadow:fonts": "postcss src/shadow.props.fonts.css -o fonts.shadow.min.css",
"shadow:gradients": "postcss src/shadow.props.gradients.css -o gradients.shadow.min.css",
"shadow:shadows": "postcss src/shadow.props.shadows.css -o shadows.shadow.min.css",
"shadow:sizes": "postcss src/shadow.props.sizes.css -o sizes.shadow.min.css",
"shadow:zindex": "postcss src/shadow.props.zindex.css -o zindex.shadow.min.css",
"shadow:colors": "postcss src/shadow.props.colors.css -o colors.shadow.min.css",
"shadow:colors:oklch-hues": "postcss src/shadow.props.colors-oklch-hues.css -o oklch-hues.shadow.min.css",
"shadow:colors-hsl": "postcss src/shadow.props.colors-hsl.css -o colors-hsl.shadow.min.css",
"shadow:colors-oklch": "postcss src/shadow.props.colors-oklch.css -o colors-oklch.shadow.min.css",
"shadow:colors:gray": "postcss src/shadow.props.gray.css -o gray.shadow.min.css",
"shadow:colors:hd-gray": "postcss src/shadow.props.gray-oklch.css -o gray-oklch.shadow.min.css",
"shadow:colors:gray-hsl": "postcss src/shadow.props.gray-hsl.css -o gray-hsl.shadow.min.css",
"shadow:colors:stone": "postcss src/shadow.props.stone.css -o stone.shadow.min.css",
"shadow:colors:stone-hsl": "postcss src/shadow.props.stone-hsl.css -o stone-hsl.shadow.min.css",
"shadow:colors:red": "postcss src/shadow.props.red.css -o red.shadow.min.css",
"shadow:colors:red-hsl": "postcss src/shadow.props.red-hsl.css -o red-hsl.shadow.min.css",
"shadow:colors:pink": "postcss src/shadow.props.pink.css -o pink.shadow.min.css",
"shadow:colors:pink-hsl": "postcss src/shadow.props.pink-hsl.css -o pink-hsl.shadow.min.css",
"shadow:colors:purple": "postcss src/shadow.props.purple.css -o purple.shadow.min.css",
"shadow:colors:purple-hsl": "postcss src/shadow.props.purple-hsl.css -o purple-hsl.shadow.min.css",
"shadow:colors:violet": "postcss src/shadow.props.violet.css -o violet.shadow.min.css",
"shadow:colors:violet-hsl": "postcss src/shadow.props.violet-hsl.css -o violet-hsl.shadow.min.css",
"shadow:colors:indigo": "postcss src/shadow.props.indigo.css -o indigo.shadow.min.css",
"shadow:colors:indigo-hsl": "postcss src/shadow.props.indigo-hsl.css -o indigo-hsl.shadow.min.css",
"shadow:colors:blue": "postcss src/shadow.props.blue.css -o blue.shadow.min.css",
"shadow:colors:blue-hsl": "postcss src/shadow.props.blue-hsl.css -o blue-hsl.shadow.min.css",
"shadow:colors:cyan": "postcss src/shadow.props.cyan.css -o cyan.shadow.min.css",
"shadow:colors:cyan-hsl": "postcss src/shadow.props.cyan-hsl.css -o cyan-hsl.shadow.min.css",
"shadow:colors:teal": "postcss src/shadow.props.teal.css -o teal.shadow.min.css",
"shadow:colors:teal-hsl": "postcss src/shadow.props.teal-hsl.css -o teal-hsl.shadow.min.css",
"shadow:colors:green": "postcss src/shadow.props.green.css -o green.shadow.min.css",
"shadow:colors:green-hsl": "postcss src/shadow.props.green-hsl.css -o green-hsl.shadow.min.css",
"shadow:colors:lime": "postcss src/shadow.props.lime.css -o lime.shadow.min.css",
"shadow:colors:lime-hsl": "postcss src/shadow.props.lime-hsl.css -o lime-hsl.shadow.min.css",
"shadow:colors:yellow": "postcss src/shadow.props.yellow.css -o yellow.shadow.min.css",
"shadow:colors:yellow-hsl": "postcss src/shadow.props.yellow-hsl.css -o yellow-hsl.shadow.min.css",
"shadow:colors:orange": "postcss src/shadow.props.orange.css -o orange.shadow.min.css",
"shadow:colors:orange-hsl": "postcss src/shadow.props.orange-hsl.css -o orange-hsl.shadow.min.css",
"shadow:colors:choco": "postcss src/shadow.props.choco.css -o choco.shadow.min.css",
"shadow:colors:choco-hsl": "postcss src/shadow.props.choco-hsl.css -o choco-hsl.shadow.min.css",
"shadow:colors:brown": "postcss src/shadow.props.brown.css -o brown.shadow.min.css",
"shadow:colors:brown-hsl": "postcss src/shadow.props.brown-hsl.css -o brown-hsl.shadow.min.css",
"shadow:colors:sand": "postcss src/shadow.props.sand.css -o sand.shadow.min.css",
"shadow:colors:sand-hsl": "postcss src/shadow.props.sand-hsl.css -o sand-hsl.shadow.min.css",
"shadow:colors:camo": "postcss src/shadow.props.camo.css -o camo.shadow.min.css",
"shadow:colors:camo-hsl": "postcss src/shadow.props.camo-hsl.css -o camo-hsl.shadow.min.css",
"shadow:colors:jungle": "postcss src/shadow.props.jungle.css -o jungle.shadow.min.css",
"shadow:colors:jungle-hsl": "postcss src/shadow.props.jungle-hsl.css -o jungle-hsl.shadow.min.css",
"lib:brand-colors": "postcss src/props.brand-colors.css -o brand-colors.min.css"
},
"devDependencies": {
"auto-changelog": "^2.5.0",
"ava": "^3.15.0",
"brotli-size": "^4.0.0",
"colorjs.io": "^0.4.1-patch.1",
"concurrently": "^7.2.2",
"cssnano": "^5.1.10",
"gzip-size": "^7.0.0",
"json": "^11.0.0",
"open-color": "^1.9.1",
"postcss": "^8.3.9",
"postcss-cli": "^8.3.1",
"postcss-import": "^14.0.2",
"postcss-preset-env": "^10.1.5",
"typescript": "^4.9.4"
}
}

File: tsconfig.json

{
"compilerOptions": {
"allowJs": true,
"declaration": true,
"emitDeclarationOnly": true,
"esModuleInterop": true,
"target": "ESNext",
"module": "ESNext",
"moduleResolution": "NodeNext",
"skipLibCheck": true
},
"include": ["dist/open-props.module.js", "src/index.js", "src/props..js"],
"exclude": ["node_modules", "src/.src.js"]
}

File: readme.md Copy Chapter

CDN ([browse](https://unpkg.com/browse/open-props@latest/))

Bookmarklet

CLI

Testing

File: CHANGELOG.md Copy Chapter

Changelog Copy Section

[v1.7.23](https://github.com/argyleink/open-props/compare/v1.7.22...v1.7.23)

[v1.7.22](https://github.com/argyleink/open-props/compare/v1.7.21...v1.7.22)

[v1.7.21](https://github.com/argyleink/open-props/compare/v1.7.20...v1.7.21)

[v1.7.20](https://github.com/argyleink/open-props/compare/v1.7.19...v1.7.20)

[v1.7.19](https://github.com/argyleink/open-props/compare/v1.7.18...v1.7.19)

[v1.7.18](https://github.com/argyleink/open-props/compare/v1.7.17...v1.7.18)

[v1.7.17](https://github.com/argyleink/open-props/compare/v1.7.16...v1.7.17)

[v1.7.16](https://github.com/argyleink/open-props/compare/v1.7.15...v1.7.16)

[v1.7.15](https://github.com/argyleink/open-props/compare/v1.6.0...v1.7.15)

[v1.6.0](https://github.com/argyleink/open-props/compare/v1.5.1...v1.6.0)

[v1.5.1](https://github.com/argyleink/open-props/compare/v1.5.0...v1.5.1)

[v1.5.0](https://github.com/argyleink/open-props/compare/v1.4.17...v1.5.0)

[v1.4.17](https://github.com/argyleink/open-props/compare/v1.4.0...v1.4.17)

[v1.4.0](https://github.com/argyleink/open-props/compare/v1.3.16...v1.4.0)

[v1.3.16](https://github.com/argyleink/open-props/compare/v1.0.0...v1.3.16)

[v1.0.0](https://github.com/argyleink/open-props/compare/v0.0.2...v1.0.0) Copy Section

v0.0.2

File: firebase.json Copy Chapter

File: open-props.resolver.json Copy Chapter

File: package.json Copy Chapter

File: tsconfig.json Copy Chapter

Explore Related Technologies & Topics

File: readme.md

File: CHANGELOG.md

Changelog

[v1.0.0](https://github.com/argyleink/open-props/compare/v0.0.2...v1.0.0)

File: firebase.json

File: open-props.resolver.json

File: package.json

File: tsconfig.json