Only extends part of tokens

[joceqo]

i did that to only extends the color, but i'm not sure this is the best options. We could have theme generators, usually though while starting a project, it's ok to keep many base token, but specify only some like color

import { defineConfig } from '@pandacss/dev';
import { preset as presetPanda } from '@pandacss/preset-panda';

export default defineConfig({
  // Whether to use css reset
  preflight: true,

  // Where to look for your css declarations
  include: [
    './src/**/*.{js,jsx,ts,tsx}',
    './pages/**/*.{js,jsx,ts,tsx}',
    './stories/**/*.{js,jsx,ts,tsx}',
  ],

  // Files to exclude
  exclude: [],

  // Useful for theme customization
  theme: {
    tokens: {
      ...presetPanda.theme.tokens,
      colors: {
        primary: {
          value: '#1B2326',
          description: 'Primary color for background',
        },
      },
    },
  },

  // The output directory for your css system
  outdir: 'src/styled-system',
});

[segunadebayo]

Hi @jocelinqueau,

You want to define your tokens in theme.extend.tokens instead of theme.tokens. The former means "extend", the later means "override"

[joceqo]

i know that, i just don't want all the colors

[anubra266]

@jocelinqueau https://panda-css.com/docs/overview/faq#how-can-i-completely-override-the-default-tokens