@bcc-code/design-tokens - BCC Design Tokens

version

A scoped design token package with light and dark themes for BCC projects.

📦 Installation

npm install @bcc-code/design-tokens@latest

Or via CDN:

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@bcc-code/design-tokens@latest/dist/variables.css"
/>

🎯 Usage Scenarios

WordPress / HTML Projects

Basic CSS Variables

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@bcc-code/design-tokens@latest/dist/variables.css"
/>

With Tailwind CSS

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@bcc-code/design-tokens@latest/dist/tailwind.css"
/>

Vue / PrimeVue Projects

With BCC PrimeVue Preset

import "@bcc-code/design-tokens/variables.css";
import { BCCPrimeVuePreset } from "@bcc-code/design-tokens/primevue-preset.js";

app.use(PrimeVue, {
  theme: {
    preset: BCCPrimeVuePreset,
  },
});

With Tailwind CSS

import "@bcc-code/design-tokens/tailwind.css";

With Both

import "@bcc-code/design-tokens/tailwind.css";
import { BCCPrimeVuePreset } from "@bcc-code/design-tokens/primevue-preset.js";

app.use(PrimeVue, {
  theme: {
    preset: BCCPrimeVuePreset,
  },
});

🤝 Contributing

Want to contribute to this project? Check out our Contributing Guide for details on how to get started.

📄 License

MIT