steven
d7c9670880
CI / backend (push) Canceled after 0s
- primary 换成 Indigo 阶（600 即 #4F46E5），中性色转 Slate 轴、纸面更冷更白 - 实心主色面（主按钮、工作区选中）用 600，链接/浅底文字仍用 700 保对比度 - 信息色 sky 调深到 #16697C，与靛蓝同屏能分清 - Logo / favicon / PWA 图标 / 安卓自适应图标统一为靛蓝底 + 白线 + 淡紫点，tools/make-icons.py 重新生成 - 文档与 e2e 断言同步（主题色 #4f46e5）
122 lines
4.0 KiB
JavaScript
122 lines
4.0 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
||
export default {
|
||
content: ["./index.html", "./src/**/*.{ts,tsx}"],
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
// 底色：近白的冷调纸面，不用纯白，避免刺眼、也让卡片有层次
|
||
paper: {
|
||
50: "#FAFAFC",
|
||
100: "#F4F5F9",
|
||
200: "#EBEDF3",
|
||
300: "#E0E4EC",
|
||
},
|
||
// 分隔线与描边（冷灰，跟靛蓝同一个中性轴）
|
||
line: {
|
||
100: "#EEF0F5",
|
||
200: "#E3E7EF",
|
||
300: "#D5DAE4",
|
||
},
|
||
// 文字与中性（Slate 轴：比纯灰更冷一点，和靛蓝同屏不打架）
|
||
ink: {
|
||
50: "#F6F8FA",
|
||
100: "#E9EEF3",
|
||
200: "#D7DEE7",
|
||
300: "#B8C2CE",
|
||
400: "#94A3B8",
|
||
500: "#64748B",
|
||
600: "#475569",
|
||
700: "#334155",
|
||
800: "#1E293B",
|
||
900: "#0F172A",
|
||
},
|
||
// 主色：靛蓝 #4F46E5（Indigo 600）。饱和度足、明度高，压在按钮/链接/选中态上不发灰。
|
||
primary: {
|
||
50: "#EEF2FF",
|
||
100: "#E0E7FF",
|
||
200: "#C7D2FE",
|
||
300: "#A5B4FC",
|
||
400: "#818CF8",
|
||
500: "#6366F1",
|
||
600: "#4F46E5",
|
||
700: "#4338CA",
|
||
800: "#3730A3",
|
||
900: "#312E81",
|
||
},
|
||
// 强调色：陶土橙，只用在"需要人注意"的地方
|
||
clay: {
|
||
50: "#FBF2EB",
|
||
100: "#F5DFCE",
|
||
200: "#EBC1A2",
|
||
300: "#DFA176",
|
||
400: "#D08454",
|
||
500: "#C2703D",
|
||
600: "#A65B2F",
|
||
700: "#854926",
|
||
800: "#65381E",
|
||
900: "#472716",
|
||
},
|
||
sage: { 500: "#2F7D5E", 50: "#EAF4EF" },
|
||
wheat: { 500: "#A97C25", 50: "#F8F1E2" },
|
||
rust: { 500: "#B04A32", 50: "#FAEDE9" },
|
||
// 信息色：往青绿方向拉开一大档，和靛蓝主色在同一屏里一眼分得清
|
||
sky: { 500: "#16697C", 50: "#E6F4F6" },
|
||
},
|
||
fontFamily: {
|
||
sans: [
|
||
"Inter",
|
||
"-apple-system",
|
||
"PingFang SC",
|
||
"HarmonyOS Sans SC",
|
||
"Microsoft YaHei",
|
||
"system-ui",
|
||
"sans-serif",
|
||
],
|
||
display: ["Inter", "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "sans-serif"],
|
||
mono: ["JetBrains Mono", "SFMono-Regular", "Consolas", "monospace"],
|
||
},
|
||
fontSize: {
|
||
"2xs": ["11px", { lineHeight: "16px", letterSpacing: "0.02em" }],
|
||
xs: ["12px", { lineHeight: "18px" }],
|
||
sm: ["13px", { lineHeight: "20px" }],
|
||
base: ["14px", { lineHeight: "22px" }],
|
||
lg: ["16px", { lineHeight: "24px" }],
|
||
xl: ["18px", { lineHeight: "26px", letterSpacing: "-0.01em" }],
|
||
"2xl": ["22px", { lineHeight: "30px", letterSpacing: "-0.02em" }],
|
||
"3xl": ["28px", { lineHeight: "36px", letterSpacing: "-0.02em" }],
|
||
"4xl": ["36px", { lineHeight: "42px", letterSpacing: "-0.03em" }],
|
||
},
|
||
borderRadius: {
|
||
md: "8px",
|
||
lg: "10px",
|
||
xl: "14px",
|
||
"2xl": "18px",
|
||
"3xl": "24px",
|
||
},
|
||
boxShadow: {
|
||
card: "0 1px 2px rgba(15,23,42,0.04), 0 8px 24px -16px rgba(15,23,42,0.30)",
|
||
pop: "0 2px 6px rgba(15,23,42,0.06), 0 20px 48px -24px rgba(15,23,42,0.32)",
|
||
inset: "inset 0 1px 0 rgba(255,255,255,0.6)",
|
||
},
|
||
keyframes: {
|
||
"fade-in": { from: { opacity: "0" }, to: { opacity: "1" } },
|
||
"slide-up": {
|
||
from: { opacity: "0", transform: "translateY(6px)" },
|
||
to: { opacity: "1", transform: "translateY(0)" },
|
||
},
|
||
"slide-in-right": {
|
||
from: { opacity: "0", transform: "translateX(24px)" },
|
||
to: { opacity: "1", transform: "translateX(0)" },
|
||
},
|
||
shimmer: { "100%": { transform: "translateX(100%)" } },
|
||
},
|
||
animation: {
|
||
"fade-in": "fade-in .18s ease-out both",
|
||
"slide-up": "slide-up .22s cubic-bezier(.2,.7,.3,1) both",
|
||
"slide-in-right": "slide-in-right .24s cubic-bezier(.2,.7,.3,1) both",
|
||
},
|
||
},
|
||
},
|
||
plugins: [],
|
||
};
|