jellyfish_designtokens
Version:
Ultimate design tokens from Jelly Fish Design System
238 lines • 5.36 kB
JSON
{
"jf": {
"size": {
"viewport": {
"min": {
"value": "22.5",
"type": "sizing",
"description": "rem size reffers to 360px"
},
"max": {
"value": "160",
"type": "sizing",
"description": "rem size reffers to 2560px"
}
}
},
"animation": {
"duration": {
"xs2": {
"value": "0ms",
"type": "other"
},
"xs": {
"value": "50ms",
"type": "other"
},
"sm": {
"value": "100ms",
"type": "other"
},
"md": {
"value": "150ms",
"type": "other"
},
"lg": {
"value": "200ms",
"type": "other"
},
"xl": {
"value": "300ms",
"type": "other"
},
"xl2": {
"value": "400ms",
"type": "other"
},
"xl3": {
"value": "500ms",
"type": "other"
},
"g": {
"value": "5000ms",
"type": "other"
}
},
"delay": {
"xs2": {
"value": "0ms",
"type": "other"
},
"xs": {
"value": "50ms",
"type": "other"
},
"sm": {
"value": "100ms",
"type": "other"
},
"md": {
"value": "150ms",
"type": "other"
},
"lg": {
"value": "200ms",
"type": "other"
},
"xl": {
"value": "300ms",
"type": "other"
},
"xl2": {
"value": "400ms",
"type": "other"
},
"xl3": {
"value": "500ms",
"type": "other"
},
"g": {
"value": "5000ms",
"type": "other"
}
},
"transition": {
"ease": {
"in": {
"value": "cubic-bezier(0, 0, 0.40, 1)",
"type": "other"
},
"out": {
"value": "cubic-bezier(0.50, 0, 1, 1)",
"type": "other"
},
"in-out": {
"value": "cubic-bezier(0.45, 0, 0.40, 1)",
"type": "other"
}
}
}
},
"opacity": {
"xs": {
"value": "0.1",
"type": "opacity"
},
"sm": {
"value": "0.2",
"type": "opacity"
},
"md": {
"value": "0.3",
"type": "opacity"
},
"lg": {
"value": "0.5",
"type": "opacity"
},
"xl": {
"value": "0.8",
"type": "opacity"
},
"total": {
"value": "1",
"type": "opacity"
},
"transparent": {
"value": "0",
"type": "opacity"
}
},
"spacing": {
"none": {
"value": "{jf.dimension.0}",
"type": "spacing"
},
"full": {
"value": "100%",
"type": "spacing"
}
},
"border": {
"radius": {
"none": {
"value": "{jf.border.radius.0}",
"type": "borderRadius"
},
"pill": {
"value": "{jf.border.radius.6}",
"type": "borderRadius"
},
"circle": {
"value": "{jf.border.radius.7}",
"type": "borderRadius"
}
}
},
"grid": {
"area": {
"logo": {
"value": "logo",
"type": "other"
},
"content": {
"value": "content",
"type": "other"
},
"footer": {
"value": "footer",
"type": "other"
},
"right-sidebar": {
"value": "right-sidebar",
"type": "other"
},
"left-sidebar": {
"value": "left-sidebar",
"type": "other"
},
"toolbar": {
"value": "toolbar",
"type": "other"
},
"navbar": {
"value": "navbar",
"type": "other"
}
},
"column-number": {
"mobile": {
"value": "4",
"type": "other",
"description": "Number of columns of a grid in a mobile screen"
},
"tablet": {
"value": "8",
"type": "other",
"description": "Number of columns of a grid in a tablet screen"
},
"screen-sm": {
"value": "12",
"type": "other",
"description": "Number of columns of a grid in a small screen"
},
"screen-md": {
"value": "12",
"type": "other",
"description": "Number of columns of a grid in a medium screen"
},
"screen-lg": {
"value": "12",
"type": "other",
"description": "Number of columns of a grid in a large screen"
},
"screen-xl": {
"value": "12",
"type": "other",
"description": "Number of columns of a grid in a extra large screen"
}
}
},
"layout": {
"boxed": {
"value": "1140px",
"type": "sizing"
}
}
}
}