concept-b-bridge-h.svg 1.1 KB

123456789101112131415161718192021222324252627
  1. <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
  2. <defs>
  3. <linearGradient id="bgB" x1="0" y1="0" x2="1" y2="1">
  4. <stop offset="0" stop-color="#1A2233"/>
  5. <stop offset="1" stop-color="#0B0F1A"/>
  6. </linearGradient>
  7. <linearGradient id="ribbonB" x1="0" y1="0" x2="1" y2="0">
  8. <stop offset="0" stop-color="#FB7185"/>
  9. <stop offset="1" stop-color="#F59E0B"/>
  10. </linearGradient>
  11. </defs>
  12. <!-- 深色底板 -->
  13. <rect x="24" y="24" width="976" height="976" rx="240" fill="url(#bgB)"/>
  14. <!-- 两根立柱:构成字母 H(Harness) -->
  15. <rect x="318" y="300" width="88" height="424" rx="44" fill="#CBD5E1"/>
  16. <rect x="618" y="300" width="88" height="424" rx="44" fill="#CBD5E1"/>
  17. <!-- 流动缎带横杆:像桥/缰绳一样把两端连接起来 -->
  18. <path d="M330 470 C450 570 574 570 694 470"
  19. fill="none" stroke="url(#ribbonB)" stroke-width="64" stroke-linecap="round"/>
  20. <!-- 缎带两端节点,暗示连接/数据流动 -->
  21. <circle cx="330" cy="470" r="30" fill="#FB7185"/>
  22. <circle cx="694" cy="470" r="30" fill="#F59E0B"/>
  23. </svg>