砚白 独立设计师作品集
深色独立设计师作品集：左侧名片栏带接单状态、流光主按钮和实时当地时间，右侧是可向任意方向拖动、带惯性的无限作品画布；点开作品进入大图查看器，另有电光描边报价弹窗与项目需求表单。
介绍
一个完整的单文件页面，从这里起步。结构、文案位和响应式都已排好，复制提示词交给模型，它会按你的品牌改写文案、配色和图片。
适用场景
设计工作室、自由职业者和个人作品集网站。
安装
订阅 Builder 后，用 8pt CLI 取回整页源码，或在已接入 8pt MCP 的编辑器里直接调用。
$ npm i -g @8pt-dev/cli && 8pt template yanbai-portfolio-canvas
mcp › 使用 8pt MCP 调用 get_template("yanbai-portfolio-canvas")
代码
单文件 HTML + CSS，无构建步骤。
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>砚白 · 独立产品设计师</title>
<meta name="description" content="砚白的作品集：可拖拽的无限作品画布、报价与项目需求弹窗。">
<style>
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%;background:#12100f;color:#efe9de;font-family:"PingFang SC","Noto Sans SC","Noto Sans CJK SC","Microsoft YaHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
…订阅 Builder 查看完整源码。查看价格