tailwind.config.js

/** @type {import('tailwindcss').Config} */
export default {
	content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
	theme: {
		extend: {
			fontSize: {
				sm: ["clamp(0.94rem, calc(0.92rem + 0.11vw), 1.00rem)", "1.5"],
				base: ["clamp(1.13rem, calc(1.08rem + 0.22vw), 1.25rem)", "1.5"],
				xl: ["clamp(1.35rem, calc(1.28rem + 0.37vw), 1.56rem)", "1.5"],
				"2xl": ["clamp(1.62rem, calc(1.50rem + 0.58vw), 1.95rem)", "1.5"],
				"3xl": ["clamp(1.94rem, calc(1.77rem + 0.87vw), 2.44rem)", "1.5"],
				"4xl": ["clamp(2.33rem, calc(2.08rem + 1.25vw), 3.05rem)", "1.5"],
				"5xl": ["clamp(2.80rem, calc(2.45rem + 1.77vw), 3.82rem)", "1.5"],
			},
			fontFamily: {
				sans: [
					"-apple-system",
					"BlinkMacSystemFont",
					"avenir next",
					"avenir",
					"segoe ui",
					"helvetica neue",
					"helvetica",
					"Cantarell",
					"Ubuntu",
					"roboto",
					"noto",
					"arial",
					"sans-serif",
				],
				serif: [
					"Iowan Old Style",
					"Apple Garamond",
					"Baskerville",
					"Times New Roman",
					"Droid Serif",
					"Times",
					"Source Serif Pro",
					"serif",
					"Apple Color Emoji",
					"Segoe UI Emoji",
					"Segoe UI Symbol",
				],
				mono: [
					"Menlo",
					"Consolas",
					"Monaco",
					"Liberation Mono",
					"Lucida Console",
					"monospace",
				],
			},
		},
	},
	plugins: [],
};