svg: 程序员节

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<title>程序员节</title>
<meta name="keywords" content="程序员节" />
<meta name="description" content="程序员节" />
</head>

<body>
<svg xmlns="http://www.w3.org/2000/svg" width="960" height="640" viewBox="0 0 960 640">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#0d1117"/>
<stop offset="100%" stop-color="#1f2937"/>
</linearGradient>
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="2" result="blur"/>
<feMerge>
<feMergeNode in="blur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>

<rect width="960" height="640" fill="url(#bg)"/>

<rect x="40" y="40" width="880" height="560" rx="18" fill="#161b22" stroke="#30363d" stroke-width="2"/>
<path d="M40 76 Q40 40 76 40 H884 Q920 40 920 76 V84 H40 Z" fill="#21262d"/>

<circle cx="70" cy="62" r="7" fill="#ff5f56"/>
<circle cx="95" cy="62" r="7" fill="#ffbd2e"/>
<circle cx="120" cy="62" r="7" fill="#27c93f"/>

<text x="480" y="68" text-anchor="middle" fill="#8b949e"
font-family="'Microsoft YaHei','PingFang SC','Noto Sans CJK SC',monospace"
font-size="16">1024_programmer_day.sh — 終端</text>

<line x1="40" y1="84" x2="920" y2="84" stroke="#30363d" stroke-width="1"/>

<g font-family="'Courier New','Microsoft YaHei','PingFang SC',monospace">
<text x="70" y="125" fill="#7ee787" font-size="20">$ ./celebrate –for=programmer</text>
<text x="70" y="160" fill="#c9d1d9" font-size="20">正在檢測發量……………. 100% (意外)</text>
<text x="70" y="192" fill="#c9d1d9" font-size="20">正在掃描 Bug……………. 0 found (假的)</text>
<text x="70" y="224" fill="#c9d1d9" font-size="20">正在編譯祝福……………. done</text>
<text x="70" y="262" fill="#58a6ff" font-size="20">&gt; 輸出：</text>
</g>

<g font-family="'Microsoft YaHei','PingFang SC','Noto Sans CJK SC',sans-serif">
<text x="70" y="305" fill="#f0f6fc" font-size="24">願你的需求不再「臨時加個小功能」</text>
<text x="70" y="345" fill="#f0f6fc" font-size="24">願你的上線永遠不用「回滾一下」</text>
<text x="70" y="385" fill="#f0f6fc" font-size="24">願你的發量像分布式系統一樣——高可用</text>
<text x="70" y="425" fill="#f0f6fc" font-size="24">願你的對象不用 new，也能自動注入</text>

<text x="70" y="485" fill="#ffd33d" font-size="32" font-weight="bold" filter="url(#glow)">1024 程序員節快樂！</text>
</g>

<text x="70" y="535" fill="#8b949e"
font-family="'Courier New','Microsoft YaHei','PingFang SC',monospace"
font-size="18">// 如果祝福有 Bug，請勿提需求，直接點讚</text>

<rect x="70" y="552" width="12" height="20" fill="#7ee787" opacity="0.85"/>
</svg>
<svg width="800" height="600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<rect width="800" height="600" fill="#292524" rx="12"/>
<!– 問號裝飾 –>
<text x="120" y="160" font-family="sans-serif" font-size="80" fill="#fb923c" opacity="0.15">?</text>
<text x="640" y="420" font-family="sans-serif" font-size="80" fill="#fb923c" opacity="0.15">?</text>

<text x="400" y="110" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="42" fill="#fb923c" text-anchor="middle" font-weight="bold">願需求永遠凍結</text>
<text x="400" y="190" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e7e5e4" text-anchor="middle">產品想新增功能時，先寫好評估報告</text>
<text x="400" y="240" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e7e5e4" text-anchor="middle">不要一句「很簡單而已」就丟過來</text>
<text x="400" y="290" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e7e5e4" text-anchor="middle">變更需求提前三天說，別下班通知</text>
<text x="400" y="340" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e7e5e4" text-anchor="middle">原型圖一次定稿，不要反覆微調</text>

<text x="400" y="430" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="20" fill="#a78bfa" text-anchor="middle">最經典臺詞：這個功能明天就要上</text>
<text x="400" y="510" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="18" fill="#a8a29e" text-anchor="middle">懂需求的產品，是程式員的稀有禮物</text>
</svg>
<svg width="800" height="600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<rect width="800" height="600" fill="#0f172a" rx="12"/>
<!– 矩陣點點背景 –>
<g opacity="0.25" fill="#34d399">
<circle cx="100" cy="100" r="2"/>
<circle cx="160" cy="140" r="2"/>
<circle cx="220" cy="90" r="2"/>
<circle cx="680" cy="480" r="2"/>
<circle cx="720" cy="520" r="2"/>
<circle cx="640" cy="440" r="2"/>
</g>

<text x="400" y="110" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="42" fill="#34d399" text-anchor="middle" font-weight="bold">佛系程式員祝福</text>
<text x="400" y="190" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#cbd5e1" text-anchor="middle">Bug 抓不完，那就學會放下</text>
<text x="400" y="240" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#cbd5e1" text-anchor="middle">問題解不掉，重啟試試看</text>
<text x="400" y="290" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#cbd5e1" text-anchor="middle">加班無盡頭，身體優先</text>
<text x="400" y="340" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#cbd5e1" text-anchor="middle">代碼寫得再好，沒人欣賞也罷</text>

<text x="400" y="430" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="20" fill="#fbbf24" text-anchor="middle">人生本來就是一場 Debug</text>
<text x="400" y="510" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="18" fill="#94a3b8" text-anchor="middle">祝所有敲鍵盤的夥伴，平安顺遂 ☕</text>
</svg>

<svg width="800" height="600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<!– 背景 –>
<rect width="800" height="600" fill="#1a202c" rx="12"/>

<!– 裝飾線條，類程式碼風格 –>
<path d="M60 80 L740 80 M60 140 L620 140 M60 200 L700 200 M60 260 L550 260 M60 320 L720 320 M60 380 L640 380 M60 440 L680 440 M60 500 L580 500" stroke="#38b2ac" stroke-width="1.5" opacity="0.3"/>

<!– 標題 –>
<text x="400" y="120" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="42" fill="#4fd1c5" text-anchor="middle" font-weight="bold">程式員節快樂</text>

<!– 祝福文案 –>
<text x="400" y="200" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e2e8f0" text-anchor="middle">願線上永不宕機，Hotfix 少一點</text>
<text x="400" y="250" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e2e8f0" text-anchor="middle">產品需求別亂改，Bug 自動消失</text>
<text x="400" y="300" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e2e8f0" text-anchor="middle">編譯一次就過，回報都是穩定版</text>
<text x="400" y="350" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#e2e8f0" text-anchor="middle">準時下班不加班，薪資年年往上加</text>

<!– 調侃小字 –>
<text x="400" y="440" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="20" fill="#f6ad55" text-anchor="middle">雖然這一切，多半只是夢</text>

<!– 底部簽 –>
<text x="400" y="520" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="18" fill="#a0aec0" text-anchor="middle">寫程式的人，敬自己一杯 ☕</text>

<!– 小圖標：咖啡簡單繪 –>
<g transform="translate(100, 480)">
<path d="M0,0 C0,-18 22,-18 22,0 L22,28 C22,36 0,36 0,28 Z" fill="#f6ad55"/>
<path d="M22,8 L34,8 C38,8 38,20 22,20" fill="none" stroke="#f6ad55" stroke-width="3"/>
</g>
<!– 小圖標：bug –>
<g transform="translate(680, 480)">
<circle cx="0" cy="0" r="10" fill="#fc8181"/>
<line x1="0" y1="-10" x2="0" y2="10" stroke="#fc8181" stroke-width="3"/>
<line x1="-10" y1="-5" x2="10" y2="-5" stroke="#fc8181" stroke-width="3"/>
<line x1="-10" y1="5" x2="10" y2="5" stroke="#fc8181" stroke-width="3"/>
</g>
</svg>

<svg width="800" height="600" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<rect width="800" height="600" fill="#111827" rx="12"/>
<!– Git 分支曲線 –>
<path d="M80 500 C160 420, 240 220, 360 180 C480 140, 560 280, 720 220" stroke="#60a5fa" stroke-width="2" fill="none" opacity="0.4"/>
<circle cx="80" cy="500" r="5" fill="#60a5fa"/>
<circle cx="360" cy="180" r="5" fill="#60a5fa"/>
<circle cx="720" cy="220" r="5" fill="#60a5fa"/>

<text x="400" y="110" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="42" fill="#60a5fa" text-anchor="middle" font-weight="bold">Git 專屬祝福</text>
<text x="400" y="190" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#d1d5db" text-anchor="middle">Commit 一次就正確，Merge 沒有衝突</text>
<text x="400" y="240" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#d1d5db" text-anchor="middle">Branch 整齊乾淨，永遠不用硬 Reset</text>
<text x="400" y="290" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#d1d5db" text-anchor="middle">代碼 Review 一稿通過，沒人挑毛病</text>
<text x="400" y="340" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="24" fill="#d1d5db" text-anchor="middle">Tag 穩定發版，線上零事故</text>

<text x="400" y="430" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="20" fill="#f472b6" text-anchor="middle">最怕一句：幫我回滾到上一個版本</text>
<text x="400" y="510" font-family="Microsoft JhengHei, Noto Sans TC, sans-serif" font-size="18" fill="#9ca3af" text-anchor="middle">願我們的人生，不要總是處於 detached HEAD 🥲</text>
</svg>
</body>
</html>

输出：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<title>程序员节</title>
<meta name="keywords" content="程序员节" />
<meta name="description" content="程序员节" />
</head>

<body>
<svg xmlns="http://www.w3.org/2000/svg" width="960" height="640" viewBox="0 0 960 640">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#0d1117"/>
<stop offset="100%" stop-color="#1f2937"/>
</linearGradient>
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="2" result="blur"/>
<feMerge>
<feMergeNode in="blur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>

<rect width="960" height="640" fill="url(#bg)"/>

<rect x="40" y="40" width="880" height="560" rx="18" fill="#161b22" stroke="#30363d" stroke-width="2"/>
<path d="M40 76 Q40 40 76 40 H884 Q920 40 920 76 V84 H40 Z" fill="#21262d"/>

<circle cx="70" cy="62" r="7" fill="#ff5f56"/>
<circle cx="95" cy="62" r="7" fill="#ffbd2e"/>
<circle cx="120" cy="62" r="7" fill="#27c93f"/>

<text x="480" y="68" text-anchor="middle" fill="#8b949e"
font-family="'Microsoft YaHei','PingFang SC','Noto Sans CJK SC',monospace"
font-size="16">1024_programmer_day.sh — 終端</text>

<line x1="40" y1="84" x2="920" y2="84" stroke="#30363d" stroke-width="1"/>

<g font-family="'Courier New','Microsoft YaHei','PingFang SC',monospace">
<text x="70" y="125" fill="#7ee787" font-size="20">$ ./celebrate –for=programmer</text>
<text x="70" y="160" fill="#c9d1d9" font-size="20">正在檢測發量……………. 100% (意外)</text>
<text x="70" y="192" fill="#c9d1d9" font-size="20">正在掃描 Bug……………. 0 found (假的)</text>
<text x="70" y="224" fill="#c9d1d9" font-size="20">正在編譯祝福……………. done</text>
<text x="70" y="262" fill="#58a6ff" font-size="20">&gt; 輸出：</text>
</g>

<g font-family="'Microsoft YaHei','PingFang SC','Noto Sans CJK SC',sans-serif">
<text x="70" y="305" fill="#f0f6fc" font-size="24">願你的需求不再「臨時加個小功能」</text>
<text x="70" y="345" fill="#f0f6fc" font-size="24">願你的上線永遠不用「回滾一下」</text>
<text x="70" y="385" fill="#f0f6fc" font-size="24">願你的發量像分布式系統一樣——高可用</text>
<text x="70" y="425" fill="#f0f6fc" font-size="24">願你的對象不用 new，也能自動注入</text>

<text x="70" y="485" fill="#ffd33d" font-size="32" font-weight="bold" filter="url(#glow)">1024 程序員節快樂！</text>
</g>

<text x="70" y="535" fill="#8b949e"
font-family="'Courier New','Microsoft YaHei','PingFang SC',monospace"
font-size="18">// 如果祝福有 Bug，請勿提需求，直接點讚</text>

<rect x="70" y="552" width="12" height="20" fill="#7ee787" opacity="0.85"/>
</svg>

</body>
</html>