minimal-v8.html 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <h2>Logo V8 — 极简徽派</h2>
  2. <p class="subtitle">马头墙的轮廓即是"知行"</p>
  3. <div style="text-align:center;padding:20px;background:linear-gradient(135deg,#f0f4ff,#f5f0ff);border-radius:24px;">
  4. <svg width="220" height="230" viewBox="0 0 220 230" xmlns="http://www.w3.org/2000/svg">
  5. <defs>
  6. <linearGradient id="blueGrad" x1="0%" y1="0%" x2="100%" y2="100%">
  7. <stop offset="0%" style="stop-color:#667eea;stop-opacity:1" />
  8. <stop offset="100%" style="stop-color:#764ba2;stop-opacity:1" />
  9. </linearGradient>
  10. <linearGradient id="redGrad" x1="0%" y1="0%" x2="100%" y2="100%">
  11. <stop offset="0%" style="stop-color:#FF6B6B;stop-opacity:1" />
  12. <stop offset="100%" style="stop-color:#FF4757;stop-opacity:1" />
  13. </linearGradient>
  14. <linearGradient id="redLight" x1="0%" y1="0%" x2="100%" y2="100%">
  15. <stop offset="0%" style="stop-color:#FF6B6B;stop-opacity:0.2" />
  16. <stop offset="100%" style="stop-color:#FF4757;stop-opacity:0.2" />
  17. </linearGradient>
  18. </defs>
  19. <!-- 极简马头墙:左高右低,三层阶梯 -->
  20. <!-- 左侧墙最高层 -->
  21. <line x1="30" y1="30" x2="70" y2="30" stroke="url(#blueGrad)" stroke-width="3.5" stroke-linecap="round"/>
  22. <line x1="70" y1="30" x2="70" y2="110" stroke="url(#blueGrad)" stroke-width="3.5"/>
  23. <!-- 二层 -->
  24. <line x1="70" y1="55" x2="100" y2="55" stroke="url(#blueGrad)" stroke-width="3.5" stroke-linecap="round"/>
  25. <line x1="100" y1="55" x2="100" y2="110" stroke="url(#blueGrad)" stroke-width="3.5"/>
  26. <!-- 三层(主墙) -->
  27. <line x1="100" y1="75" x2="150" y2="75" stroke="url(#blueGrad)" stroke-width="3.5" stroke-linecap="round"/>
  28. <line x1="150" y1="75" x2="150" y2="110" stroke="url(#blueGrad)" stroke-width="3.5"/>
  29. <!-- 地面线 -->
  30. <line x1="30" y1="110" x2="150" y2="110" stroke="url(#blueGrad)" stroke-width="3.5" stroke-linecap="round"/>
  31. <!-- 左侧爱心的上半部分 = "知" 的暗示 -->
  32. <path d="M110 87 C106 82, 96 80, 92 85 C88 90, 92 96, 110 105"
  33. fill="none" stroke="url(#redGrad)" stroke-width="2.5" stroke-linecap="round"/>
  34. <!-- 右侧爱心的上半 = "行" 的暗示 -->
  35. <path d="M145 87 C149 82, 144 80, 140 85 C136 90, 140 96, 145 105"
  36. fill="none" stroke="url(#blueGrad)" stroke-width="2.5" stroke-linecap="round"/>
  37. <!-- 底部幼苗 -->
  38. <path d="M110 105 C108 98, 106 94, 104 90"
  39. fill="none" stroke="url(#blueGrad)" stroke-width="2" stroke-linecap="round"/>
  40. <path d="M104 90 C101 87, 99 89, 97 92"
  41. fill="none" stroke="url(#blueGrad)" stroke-width="1.5" stroke-linecap="round"/>
  42. </svg>
  43. <div style="margin-top:16px;">
  44. <span style="font-size:32px;font-weight:bold;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:6px;">
  45. 知行益家
  46. </span>
  47. </div>
  48. <div style="color:#999;font-size:13px;margin-top:4px;letter-spacing:3px;">家是小国 · 国是大家</div>
  49. </div>
  50. <div style="margin-top:24px;padding:16px;background:#fffbe6;border-radius:12px;border:1px solid #ffe58f;">
  51. <p style="font-size:14px;color:#b8860b;margin:0;"><strong>极简设计理念:</strong></p>
  52. <p style="font-size:14px;color:#666;margin:8px 0 0 0;">
  53. 三段阶梯 = 马头墙的精简轮廓<br>
  54. 左侧红弧 = 知(求知之心,温暖)<br>
  55. 右侧蓝弧 = 行(行动之力,理性)<br>
  56. 下方幼苗 = 成长(知行合一的结果)<br><br>
  57. 总共不到20条线,干净利落。
  58. </p>
  59. </div>