liquidifyPreset relie les valeurs du thème Tailwind aux variables CSS de Liquidify. Il n’installe pas Tailwind et n’enregistre aucun plugin.

import { liquidifyPreset } from "@liquidify/tokens/tailwind-preset"

export default {
  presets: [liquidifyPreset],
  content: ["./src/**/*.{js,ts,jsx,tsx}"],
}

Importez les variables une seule fois :

import "@liquidify/tokens/variables.css"

Le preset étend les couleurs, espaces, rayons, familles et tailles de police. Les utilitaires comme bg-bg-secondary, text-label et rounded-pill utilisent var(--lq-*) et répondent donc au thème et à la plateforme.

Étendez le preset plutôt que de copier ses valeurs résolues dans un autre thème. Vous évitez ainsi les différences entre les composants et les utilitaires de l’application.