@mgoodfellow/park-ui-panda-preset
Version:
Panda CSS Preset for Park UI
93 lines (90 loc) • 4.24 kB
text/typescript
import { defineSemanticTokens, defineTokens } from '@pandacss/dev'
const tokens = defineTokens.colors({
light: {
'1': { value: '#fcfdfa' },
'2': { value: '#f8faf3' },
'3': { value: '#eef6d6' },
'4': { value: '#e2f0bd' },
'5': { value: '#d3e7a6' },
'6': { value: '#c2da91' },
'7': { value: '#abc978' },
'8': { value: '#8db654' },
'9': { value: '#bdee63' },
'10': { value: '#b0e64c' },
'11': { value: '#5c7c2f' },
'12': { value: '#37401c' },
a1: { value: '#66990005' },
a2: { value: '#6b95000c' },
a3: { value: '#96c80029' },
a4: { value: '#8fc60042' },
a5: { value: '#81bb0059' },
a6: { value: '#72aa006e' },
a7: { value: '#61990087' },
a8: { value: '#559200ab' },
a9: { value: '#93e4009c' },
a10: { value: '#8fdc00b3' },
a11: { value: '#375f00d0' },
a12: { value: '#1e2900e3' },
},
dark: {
'1': { value: '#11130c' },
'2': { value: '#151a10' },
'3': { value: '#1f2917' },
'4': { value: '#29371d' },
'5': { value: '#334423' },
'6': { value: '#3d522a' },
'7': { value: '#496231' },
'8': { value: '#577538' },
'9': { value: '#bdee63' },
'10': { value: '#d4ff70' },
'11': { value: '#bde56c' },
'12': { value: '#e3f7ba' },
a1: { value: '#11bb0003' },
a2: { value: '#78f7000a' },
a3: { value: '#9bfd4c1a' },
a4: { value: '#a7fe5c29' },
a5: { value: '#affe6537' },
a6: { value: '#b2fe6d46' },
a7: { value: '#b6ff6f57' },
a8: { value: '#b6fd6d6c' },
a9: { value: '#caff69ed' },
a10: { value: '#d4ff70' },
a11: { value: '#d1fe77e4' },
a12: { value: '#e9febff7' },
},
})
const semanticTokens = defineSemanticTokens.colors({
'1': { value: { _light: '{colors.lime.light.1}', _dark: '{colors.lime.dark.1}' } },
'2': { value: { _light: '{colors.lime.light.2}', _dark: '{colors.lime.dark.2}' } },
'3': { value: { _light: '{colors.lime.light.3}', _dark: '{colors.lime.dark.3}' } },
'4': { value: { _light: '{colors.lime.light.4}', _dark: '{colors.lime.dark.4}' } },
'5': { value: { _light: '{colors.lime.light.5}', _dark: '{colors.lime.dark.5}' } },
'6': { value: { _light: '{colors.lime.light.6}', _dark: '{colors.lime.dark.6}' } },
'7': { value: { _light: '{colors.lime.light.7}', _dark: '{colors.lime.dark.7}' } },
'8': { value: { _light: '{colors.lime.light.8}', _dark: '{colors.lime.dark.8}' } },
'9': { value: { _light: '{colors.lime.light.9}', _dark: '{colors.lime.dark.9}' } },
'10': { value: { _light: '{colors.lime.light.10}', _dark: '{colors.lime.dark.10}' } },
'11': { value: { _light: '{colors.lime.light.11}', _dark: '{colors.lime.dark.11}' } },
'12': { value: { _light: '{colors.lime.light.12}', _dark: '{colors.lime.dark.12}' } },
a1: { value: { _light: '{colors.lime.light.a1}', _dark: '{colors.lime.dark.a1}' } },
a2: { value: { _light: '{colors.lime.light.a2}', _dark: '{colors.lime.dark.a2}' } },
a3: { value: { _light: '{colors.lime.light.a3}', _dark: '{colors.lime.dark.a3}' } },
a4: { value: { _light: '{colors.lime.light.a4}', _dark: '{colors.lime.dark.a4}' } },
a5: { value: { _light: '{colors.lime.light.a5}', _dark: '{colors.lime.dark.a5}' } },
a6: { value: { _light: '{colors.lime.light.a6}', _dark: '{colors.lime.dark.a6}' } },
a7: { value: { _light: '{colors.lime.light.a7}', _dark: '{colors.lime.dark.a7}' } },
a8: { value: { _light: '{colors.lime.light.a8}', _dark: '{colors.lime.dark.a8}' } },
a9: { value: { _light: '{colors.lime.light.a9}', _dark: '{colors.lime.dark.a9}' } },
a10: { value: { _light: '{colors.lime.light.a10}', _dark: '{colors.lime.dark.a10}' } },
a11: { value: { _light: '{colors.lime.light.a11}', _dark: '{colors.lime.dark.a11}' } },
a12: { value: { _light: '{colors.lime.light.a12}', _dark: '{colors.lime.dark.a12}' } },
default: { value: { _light: '{colors.lime.light.9}', _dark: '{colors.lime.dark.9}' } },
emphasized: { value: { _light: '{colors.lime.light.10}', _dark: '{colors.lime.dark.10}' } },
fg: { value: { _light: '{colors.gray.light.12}', _dark: '{colors.gray.light.12}' } },
text: { value: { _light: '{colors.lime.light.a11}', _dark: '{colors.lime.dark.a11}' } },
})
export default {
name: 'lime',
tokens,
semanticTokens,
}