0.0.22 • Published 3 months ago

@acdh-oeaw/tailwindcss-preset v0.0.22

Weekly downloads
-
License
MIT
Repository
-
Last release
3 months ago

acdh-oeaw tailwindcss preset

this is a customisable preset for tailwindcss. it includes animation utilities from tailwindcss-animate and typography styles from @tailwindcss/typography.

how to install

npm install tailwindcss @acdh-oeaw/tailwindcss-preset

how to setup

// tailwind.config.ts

import { type Config } from "tailwindcss";
import { preset } from "@acdh-oeaw/tailwindcss-preset";

const config = {
	content: ["./src/**/*.@(ts|tsx)"],
	presets: [preset],
} satisfies Config;

export default config;

how to toggle dark mode

dark mode can be toggled via data attribute on the root element:

<html data-color-scheme="dark">
	<!-- ... -->
</html>

how to customise

design tokens can be customised via css custom properties. note that colors must be defined as hsl channels.

:root {
	--color-foreground: 240deg 6% 10%;
}

:root[data-color-scheme="dark"] {
	--color-foreground: 240deg 6% 90%;
}
@tailwindcss/typographytailwindcss-animate
@everything-registry/sub-chunk-24
0.0.22

3 months ago

0.0.21

3 months ago

0.0.20

3 months ago

0.0.18

3 months ago

0.0.19

3 months ago

0.0.17

7 months ago

0.0.16

7 months ago

0.0.15

7 months ago

0.0.14

8 months ago

0.0.13

9 months ago

0.0.12

9 months ago

0.0.11

9 months ago

0.0.10

9 months ago

0.0.9

9 months ago

0.0.8

10 months ago

0.0.7

10 months ago

0.0.6

10 months ago

0.0.5

10 months ago

0.0.4

10 months ago

0.0.3

10 months ago

0.0.2

10 months ago

0.0.1

10 months ago