| 1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720"> |
| 2 | <defs> |
| 3 | <linearGradient id="jewelBg" x1="0%" y1="0%" x2="100%" y2="100%"> |
| 4 | <stop offset="0%" stop-color="#0A1A2E"/> |
| 5 | <stop offset="100%" stop-color="#1A0A2E"/> |
| 6 | </linearGradient> |
| 7 | <linearGradient id="emeraldAccent" x1="0%" y1="0%" x2="100%" y2="0%"> |
| 8 | <stop offset="0%" stop-color="#1A6B4A"/> |
| 9 | <stop offset="100%" stop-color="#0A8A6A"/> |
| 10 | </linearGradient> |
| 11 | <linearGradient id="sapphireAccent" x1="0%" y1="0%" x2="100%" y2="0%"> |
| 12 | <stop offset="0%" stop-color="#1A3A6B"/> |
| 13 | <stop offset="100%" stop-color="#0A4A8A"/> |
| 14 | </linearGradient> |
| 15 | <linearGradient id="goldAccent" x1="0%" y1="0%" x2="100%" y2="0%"> |
| 16 | <stop offset="0%" stop-color="#D4A016"/> |
| 17 | <stop offset="100%" stop-color="#F5C040"/> |
| 18 | </linearGradient> |
| 19 | <linearGradient id="dividerGrad" x1="0%" y1="0%" x2="100%" y2="0%"> |
| 20 | <stop offset="0%" stop-color="#1A6B4A"/> |
| 21 | <stop offset="33%" stop-color="#1A3A6B"/> |
| 22 | <stop offset="66%" stop-color="#D4A016"/> |
| 23 | <stop offset="100%" stop-color="#7C3A7A"/> |
| 24 | </linearGradient> |
| 25 | </defs> |
| 26 | |
| 27 | <!-- Background — deep jewel dark --> |
| 28 | <rect width="1280" height="720" fill="url(#jewelBg)"/> |
| 29 | |
| 30 | <!-- TOP HALF — Text area (y: 0 - 340) --> |
| 31 | <!-- Meta label --> |
| 32 | <text x="640" y="36" text-anchor="middle" font-family="Arial, sans-serif" |
| 33 | font-size="13" fill="#9090A0" letter-spacing="3">P15 · flat × jewel-tone · 上文下图</text> |
| 34 | |
| 35 | <!-- Main title --> |
| 36 | <text x="640" y="100" text-anchor="middle" font-family="Georgia, 'Microsoft YaHei', serif" |
| 37 | font-size="52" font-weight="bold" fill="#E8E8F0">上文下图</text> |
| 38 | <text x="640" y="138" text-anchor="middle" font-family="Arial, 'Microsoft YaHei', sans-serif" |
| 39 | font-size="20" fill="#9090A0">Top Text · Bottom Image · 对等对话</text> |
| 40 | |
| 41 | <!-- Jewel accent bars --> |
| 42 | <rect x="240" y="154" width="200" height="3" rx="1.5" fill="url(#emeraldAccent)"/> |
| 43 | <rect x="448" y="154" width="200" height="3" rx="1.5" fill="url(#sapphireAccent)"/> |
| 44 | <rect x="656" y="154" width="200" height="3" rx="1.5" fill="url(#goldAccent)"/> |
| 45 | |
| 46 | <!-- Body text --> |
| 47 | <text x="640" y="200" text-anchor="middle" font-family="Arial, 'Microsoft YaHei', sans-serif" |
| 48 | font-size="20" fill="#E8E8F0">扁平设计风格图像置于下半幅，</text> |
| 49 | <text x="640" y="228" text-anchor="middle" font-family="Arial, 'Microsoft YaHei', sans-serif" |
| 50 | font-size="20" fill="#E8E8F0">文字在上方独立呼吸，图文各占一半，</text> |
| 51 | <text x="640" y="256" text-anchor="middle" font-family="Arial, 'Microsoft YaHei', sans-serif" |
| 52 | font-size="20" fill="#9090A0">形成对等的视觉对话关系。</text> |
| 53 | |
| 54 | <!-- Jewel color swatches row --> |
| 55 | <rect x="324" y="292" width="40" height="24" rx="3" fill="#1A6B4A"/> |
| 56 | <text x="374" y="309" font-family="Arial, sans-serif" font-size="14" fill="#6A9A7A">祖母绿</text> |
| 57 | <rect x="484" y="292" width="40" height="24" rx="3" fill="#1A3A6B"/> |
| 58 | <text x="534" y="309" font-family="Arial, sans-serif" font-size="14" fill="#6A8AAA">蓝宝石</text> |
| 59 | <rect x="644" y="292" width="40" height="24" rx="3" fill="#D4A016"/> |
| 60 | <text x="694" y="309" font-family="Arial, sans-serif" font-size="14" fill="#AAAA6A">黄金</text> |
| 61 | <rect x="804" y="292" width="40" height="24" rx="3" fill="#7C3A7A"/> |
| 62 | <text x="854" y="309" font-family="Arial, sans-serif" font-size="14" fill="#AA7AAA">紫晶</text> |
| 63 | |
| 64 | <!-- DIVIDER LINE — jewel gradient --> |
| 65 | <rect x="0" y="340" width="1280" height="4" fill="url(#dividerGrad)"/> |
| 66 | |
| 67 | <!-- BOTTOM HALF — Image area (y: 344 - 720) --> |
| 68 | <image href="../images/p15_bottom_img.png" x="0" y="344" width="1280" height="376" |
| 69 | preserveAspectRatio="xMidYMid slice"/> |
| 70 | |
| 71 | <!-- Subtle image overlay for depth --> |
| 72 | <rect x="0" y="344" width="1280" height="40" fill="url(#jewelBg)" fill-opacity="0.4"/> |
| 73 | |
| 74 | <!-- Bottom meta small --> |
| 75 | <rect x="0" y="688" width="1280" height="32" fill="#0A1A2E" fill-opacity="0.7"/> |
| 76 | <text x="640" y="708" text-anchor="middle" font-family="Consolas, monospace" |
| 77 | font-size="12" fill="#9090A0" letter-spacing="2">flat design · bird's-eye workspace · jewel-tone palette</text> |
| 78 | <text x="1240" y="708" text-anchor="end" font-family="Arial, sans-serif" font-size="13" fill="#5A5A72">15</text> |
| 79 | </svg> |
| 80 |