tglide/uno-pollen

Uno Pollen

Use Pollen's CSS variables with Uno CSS. Uses colar colors.

Configuration

Install deps

ni -D @unocss/core pollen-css @unocss/preset-icons @unocss/transformer-directives @unocss/vite sass @iconify/json

(Optional) install fonts

ni @fontsource/montserrat @fontsource/inter @fontsource/fira-mono

Copy over files

Copy everything from the COPY folder to your project.

Add to vite.config.js

import Unocss from "@unocss/vite";
import unoConfig from "./uno.config";

/** @type {import('vite').UserConfig} */
const config = {
  // ...
  plugins: [
    // UnoCSS must be at the top!
    Unocss({
      ...unoConfig,
    }),
    // ...
  ],
  // ...
};

export default config;

Import styles

In your main.js or main.ts file, import the necessary styles.

import "src/styles/index.scss";
import "uno.css";

Usage

To rebuild styles, run npx pollen