28/60 题双版本 · 中英双语 · 几何头像 · 深度解析 · 分享卡片
不只是测出四个字母，而是帮你理解每一种人格背后的逻辑。
- 📝 双版本题库 — 28 题快速版 + 60 题完整版，自由切换
- 🌍 中英双语 — 全站中英文无缝切换
- 🌓 深色/浅色/跟随系统 — 三种主题模式
- 🎨 几何头像 — 16 种 MBTI 类型各对应独特几何矢量头像
- 📊 维度可视化 — Recharts 雷达图 + 四维度百分比
- 🦁 野兽/人物类比 — 每种人格匹配对应动物和历史人物
- 📤 分享卡片 — 一键导出测试结果图片
- 📱 全响应式 — 手机/平板/桌面完美适配
- ⚡ 纯前端 — 零后端依赖，所有计算在浏览器完成
git clone https://github.com/Jokeyou/mbti-test.git
cd mbti-test
npm install
npm run dev
# 打开 http://localhost:5173| 层 | 技术 |
|---|---|
| 框架 | React 19 + TypeScript |
| 构建 | Vite |
| 样式 | Tailwind CSS |
| 动画 | Framer Motion |
| 图表 | Recharts |
| 路由 | React Router v7 |
| 导出 | html-to-image |
| 路由 | 说明 |
|---|---|
/ |
首页 — 选择版本 + 功能展示 |
/test |
答题页 — 进度条 + 题目动画 |
/result |
结果页 — 维度雷达图 + 野兽/人物类比 |
/types |
16 型一览 — 全部人格概览 |
/type/:id |
人格详情 — 深度解析 |
/beast |
野兽预览 — 动物类比展示 |
/figure |
人物预览 — 历史人物类比展示 |
帮更多人理解自己，也理解他人。
MBTI 的魅力在于它提供了一种理解人性的语言。 欢迎把它变得更好玩、更准确、更美。
| 方向 | 做什么 |
|---|---|
| 🎨 前端/交互 | 答题动画优化、分享卡片模板扩展、移动端手势 |
| 📝 内容 | 题库扩充、人格解析文案优化、英文翻译校对 |
| 🎨 设计 | 16 型几何头像优化、主题配色 |
| 📊 数据 | 统计页面、结果分布可视化 |
| 🧠 算法 | 答题算法优化、维度权重调整 |
git checkout -b feature/your-feature
git commit -m 'feat: add your feature'
git push origin feature/your-feature
# 提交 Pull RequestMIT © Jokeyou
🧠 测一测，发现你的隐藏人格 → 在线体验