Ship the full Vite/React marketing site with white-background styling, softer gradients, rounded typography, and section layout updates from the design pass. Co-authored-by: Cursor <cursoragent@cursor.com>
71 lines
2.2 KiB
TypeScript
71 lines
2.2 KiB
TypeScript
import type { Config } from "tailwindcss";
|
|
|
|
const config: Config = {
|
|
content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
ink: {
|
|
950: "#FFFFFF",
|
|
900: "#F8FAFC",
|
|
800: "#F1F5F9",
|
|
700: "#E2E8F0",
|
|
600: "#CBD5E1",
|
|
},
|
|
cyan: {
|
|
DEFAULT: "#F97316",
|
|
soft: "#FDBA74",
|
|
},
|
|
violet: {
|
|
DEFAULT: "#EF4444",
|
|
soft: "#FCA5A5",
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: [
|
|
"Plus Jakarta Sans",
|
|
"Noto Sans SC",
|
|
"PingFang SC",
|
|
"Hiragino Sans GB",
|
|
"Microsoft YaHei",
|
|
"ui-sans-serif",
|
|
"system-ui",
|
|
"sans-serif",
|
|
],
|
|
mono: ["ui-monospace", "SFMono-Regular", "Menlo", "monospace"],
|
|
},
|
|
backgroundImage: {
|
|
"grid-fade":
|
|
"radial-gradient(ellipse at center, rgba(251,146,60,0.06) 0%, transparent 75%)",
|
|
"brand-gradient":
|
|
"linear-gradient(106deg, #E84832 0%, #EC5F30 22%, #F07432 48%, #F38834 72%, #F9AD52 100%)",
|
|
"brand-gradient-soft":
|
|
"linear-gradient(106deg, rgba(232,72,50,0.28) 0%, rgba(240,116,50,0.20) 50%, rgba(249,173,82,0.16) 100%)",
|
|
"ambient-top":
|
|
"radial-gradient(ellipse 90% 70% at 50% -8%, rgba(254,215,170,0.38) 0%, rgba(251,146,60,0.14) 38%, transparent 72%)",
|
|
"ambient-bottom":
|
|
"radial-gradient(ellipse 85% 65% at 50% 108%, rgba(251,113,133,0.22) 0%, rgba(248,113,113,0.10) 42%, transparent 74%)",
|
|
},
|
|
boxShadow: {
|
|
"glow-cyan": "0 0 72px -18px rgba(251,146,60,0.28)",
|
|
"glow-violet": "0 0 72px -18px rgba(251,113,133,0.24)",
|
|
"glow-soft": "0 0 100px -24px rgba(251,146,60,0.18)",
|
|
},
|
|
animation: {
|
|
"spin-slow": "spin 16s linear infinite",
|
|
float: "float 8s ease-in-out infinite",
|
|
"pulse-slow": "pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite",
|
|
},
|
|
keyframes: {
|
|
float: {
|
|
"0%, 100%": { transform: "translateY(0px)" },
|
|
"50%": { transform: "translateY(-14px)" },
|
|
},
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|
|
|
|
export default config;
|