Michael Wang GitHub avatar

Michael Wang 王羽丰

Electrical & Electronic Engineering · DSP · FPGA · Robotics

苏州 · China Email: a55ume@qq.com 📋 GitHub Starters
GitHub LinkedIn
Python C/C++ Verilog/SystemVerilog Linux Git DSP

⚙️ RoboVigor 机器人团队

算法组成员 · 机器视觉、部署与调试 · 组织周报与新人培训。

🧮 4-bit 微处理器设计

使用 Verilog 进行指令集与处理器设计与仿真,完成小型 SoC 原型。

🌿 城市绿色能源规划

与 ARUP 合作参与 SHIPs 项目,探索城市碳中和与能源自给方案。

--text: #111; --muted: #4a5568; --chip-bg: rgba(0, 0, 0, 0.06); --border: rgba(0,0,0,.08); --shadow: 0 10px 30px rgba(16,24,40,.12); } } html[data-theme="dark"] { --bg: #0b0f17; --card: rgba(255, 255, 255, 0.06); --text: #e6e6e6; --muted: #aab0c0; --chip-bg: rgba(255,255,255,.08); --border: rgba(255,255,255,.15); --shadow: 0 10px 30px rgba(0,0,0,.35); } html, body { height: 100%; } body { margin: 0; font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"; color: var(--text); background: radial-gradient(1200px 1200px at 80% -10%, rgba(124,92,255,.25), transparent 60%), radial-gradient(900px 900px at -10% 100%, rgba(0,212,255,.25), transparent 60%), var(--bg); overflow-x: hidden; } .bg-anim { position: fixed; inset: -20vmax; pointer-events: none; filter: blur(60px); opacity: .6; background: conic-gradient(from 0deg, var(--accent), var(--accent-2), #ff6ec7, var(--accent)); animation: spin 24s linear infinite; transform-origin: 60% 40%; } @keyframes spin { to { transform: rotate(1turn); } } .container { min-height: 100%; display: grid; place-items: center; padding: 48px 20px; } .card { position: relative; width: min(980px, 94vw); margin-inline: auto; background: var(--card); backdrop-filter: blur(18px) saturate(120%); -webkit-backdrop-filter: blur(18px) saturate(120%); border: 1px solid var(--border); border-radius: 24px; box-shadow: var(--shadow); overflow: hidden; } .header { display: flex; align-items: center; gap: 24px; padding: 32px 28px 0; flex-wrap: wrap; } .avatar { width: 88px; height: 88px; flex: 0 0 88px; border-radius: 20px; position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(135deg, var(--accent), var(--accent-2)); display: grid; place-items: center; color: white; font-weight: 800; font-size: 28px; letter-spacing: .5px; } .badges { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-start; } .badge { padding: 6px 10px; border-radius: 999px; font-size: 12px; background: var(--chip-bg); border: 1px solid var(--border); } .title { font-size: clamp(26px, 4vw, 36px); margin: 0; } .subtitle { margin: 6px 0 10px; color: var(--muted); font-size: 14px; line-height: 1.4; } .actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 0; } .btn { appearance: none; border: 1px solid var(--border); background: transparent; color: var(--text); text-decoration: none; padding: 10px 16px; border-radius: 14px; font-weight: 600; display: inline-flex; align-items: center; gap: 10px; transition: transform .08s ease, background .2s ease, border-color .2s ease; } .btn:hover { transform: translateY(-1px); border-color: var(--accent); } .btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; border-color: transparent; } .btn .icon { width: 18px; height: 18px; display: inline-block; } /* Make gradient buttons render cleanly, avoid right-edge hairline */ .btn, .btn.primary { -webkit-background-clip: padding-box; background-clip: padding-box; } .resume-btn { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #fff; border-color: transparent; } .divider { height: 1px; background: var(--border); margin: 24px 0; } .content { padding: 0 28px 28px; } .chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 16px 0 0; } .chip { font-size: 12px; padding: 8px 12px; border-radius: 999px; background: var(--chip-bg); border: 1px solid var(--border); } .grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; margin-top: 22px; } .feature { grid-column: span 12; border: 1px solid var(--border); border-radius: 18px; padding: 18px; background: rgba(255,255,255,.03); } .feature h3 { margin: 0 0 8px; font-size: 16px; } .feature p { margin: 0; color: var(--muted); font-size: 14px; } @media (min-width: 760px) { .feature { grid-column: span 4; } } .footer { display: flex; align-items: center; justify-content: space-between; padding: 22px 28px 28px; gap: 10px; flex-wrap: wrap; color: var(--muted); font-size: 12px; } .theme-toggle { cursor: pointer; border: 1px solid var(--border); background: var(--chip-bg); border-radius: 12px; padding: 8px 12px; display: inline-flex; align-items: center; gap: 6px; } .copy { cursor: pointer; } /* Nice subtle hover glow */ .btn.primary:hover { box-shadow: 0 10px 20px rgba(124,92,255,.35), 0 4px 10px rgba(0,212,255,.25); } .avatar img { width: 100%; height: 100%; object-fit: cover; display: block; } /* Resume Page */ #resumeCard { padding: 0; } .resume-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px; border-bottom: 1px solid var(--border); background: linear-gradient(180deg, rgba(255,255,255,.06), transparent); } .resume-name { font-size: clamp(22px, 3.4vw, 30px); margin: 0; } .resume-title { margin: 4px 0 0; color: var(--muted); font-size: 14px; } .resume-actions { display: flex; gap: 8px; flex-wrap: wrap; } .resume-content { padding: 18px 24px 26px; display: grid; grid-template-columns: 1fr; gap: 18px; } .resume-section { border: 1px solid var(--border); border-radius: 14px; padding: 14px; background: rgba(255,255,255,.03); } .resume-section h3 { margin: 0 0 10px; font-size: 15px; } .resume-list { margin: 0; padding-left: 18px; color: var(--muted); } .resume-list li { margin: 6px 0; } .resume-meta { color: var(--muted); font-size: 12px; } .resume-grid { display: grid; grid-template-columns: 1fr; gap: 16px; } @media (min-width: 860px){ .resume-content{ grid-template-columns: 280px 1fr; } } .lang-toggle { border: 1px solid var(--border); background: var(--chip-bg); border-radius: 12px; padding: 8px 10px; display: inline-flex; align-items: center; gap: 8px; } .link-like { cursor: pointer; text-decoration: underline; } /* Print */ @media print { body { background: white; } .bg-anim, #homeCard, .theme-toggle { display: none !important; } #resumeCard { box-shadow: none; border: none; } .resume-header { background: none; border: none; } } @media (max-width: 560px){ .header{ justify-content: center; text-align: center; } .badges, .actions { justify-content: center; } .card { width: min(980px, 92vw); } .container{ padding: 40px 14px; } }
Michael Wang GitHub avatar

Michael Wang 王羽丰

Electrical & Electronic Engineering · DSP · FPGA · Robotics

苏州 · China Email: a55ume@qq.com 📋 GitHub Starters
GitHub LinkedIn
Python C/C++ Verilog/SystemVerilog Linux Git DSP

⚙️ RoboVigor 机器人团队

算法组成员 · 机器视觉、部署与调试 · 组织周报与新人培训。

🧮 4-bit 微处理器设计

使用 Verilog 进行指令集与处理器设计与仿真,完成小型 SoC 原型。

🌿 城市绿色能源规划

与 ARUP 合作参与 SHIPs 项目,探索城市碳中和与能源自给方案。