<svg width="1200" height="720" viewBox="0 0 1200 720" xmlns="http://www.w3.org/2000/svg">
  <rect width="1200" height="720" fill="#f7f9fc"/>
  <rect x="40" y="40" width="1120" height="640" rx="28" fill="#ffffff" stroke="#d8e2ef"/>
  <text x="70" y="92" font-size="36" font-family="Arial, Microsoft YaHei" fill="#17324d" font-weight="700">可观测性三要素</text>
  <text x="70" y="132" font-size="18" font-family="Arial, Microsoft YaHei" fill="#617389">日志、指标、链路追踪如何在 DevOps 里形成同一套反馈体系</text>
  <circle cx="280" cy="330" r="120" fill="#edf4ff" stroke="#bfd2f1"/>
  <circle cx="600" cy="330" r="120" fill="#eefaf4" stroke="#b9e0c7"/>
  <circle cx="920" cy="330" r="120" fill="#fff5ea" stroke="#efd2a5"/>
  <text x="232" y="325" font-size="34" font-family="Arial, Microsoft YaHei" fill="#24538f" font-weight="700">日志</text>
  <text x="194" y="366" font-size="20" font-family="Arial, Microsoft YaHei" fill="#47617c">回答“发生了什么”</text>
  <text x="552" y="325" font-size="34" font-family="Arial, Microsoft YaHei" fill="#226543" font-weight="700">指标</text>
  <text x="516" y="366" font-size="20" font-family="Arial, Microsoft YaHei" fill="#426452">回答“哪里异常了”</text>
  <text x="840" y="325" font-size="34" font-family="Arial, Microsoft YaHei" fill="#9a5a12" font-weight="700">链路追踪</text>
  <text x="807" y="366" font-size="20" font-family="Arial, Microsoft YaHei" fill="#72583a">回答“问题卡在哪”</text>
  <rect x="180" y="515" width="840" height="78" rx="20" fill="#17324d"/>
  <text x="250" y="560" font-size="24" font-family="Arial, Microsoft YaHei" fill="#ffffff">三者分开建设只能看到碎片，接回交付入口后才会形成发布、故障与优化闭环</text>
</svg>