Analytics

Data report / dashboard

KPIs, tables, and insight summary for a weekly or monthly metrics report.

Publish via ShipPage

Terminal
curl -X POST https://shippage.ai/v1/publish \
  -H "Content-Type: application/json" \
  -d @- <<'JSON'
{
  "title": "Data report / dashboard",
  "public": true,
  "html": "<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><title>Weekly metrics report</title><style>\n  *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; line-height: 1.6; color: #0f172a; background: #fff; }\n  h1, h2, h3 { letter-spacing: -0.02em; }\n  a { color: #2563eb; }\n</style><style>\n      body { background: #f8fafc; }\n      .wrap { max-width: 960px; margin: 0 auto; padding: 40px 24px; }\n      header { margin-bottom: 32px; }\n      header h1 { font-size: 28px; font-weight: 700; }\n      header p { color: #64748b; margin-top: 4px; }\n      .kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 32px; }\n      .kpi { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 20px; }\n      .kpi .label { font-size: 12px; color: #64748b; text-transform: uppercase; letter-spacing: 0.08em; }\n      .kpi .value { font-size: 28px; font-weight: 700; margin-top: 6px; }\n      .kpi .delta { font-size: 13px; margin-top: 2px; }\n      .delta.up { color: #16a34a; } .delta.down { color: #dc2626; }\n      section { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; margin-bottom: 16px; }\n      section h2 { font-size: 18px; margin-bottom: 16px; }\n      table { width: 100%; border-collapse: collapse; font-size: 14px; }\n      th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #e2e8f0; }\n      th { color: #64748b; font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; }\n      .insight { background: #fef3c7; border-left: 3px solid #f59e0b; padding: 16px; border-radius: 4px; font-size: 14px; color: #78350f; margin-top: 8px; }\n      @media (max-width: 768px) { .kpis { grid-template-columns: 1fr 1fr; } }\n    </style></head><body><div class=\"wrap\">\n      <header><h1>Weekly metrics — Apr 12–19, 2026</h1><p>Auto-generated by Claude · Published via ShipPage</p></header>\n      <div class=\"kpis\">\n        <div class=\"kpi\"><div class=\"label\">MRR</div><div class=\"value\">$48.2K</div><div class=\"delta up\">▲ 8.4% WoW</div></div>\n        <div class=\"kpi\"><div class=\"label\">Active users</div><div class=\"value\">2,847</div><div class=\"delta up\">▲ 12% WoW</div></div>\n        <div class=\"kpi\"><div class=\"label\">Churn</div><div class=\"value\">2.1%</div><div class=\"delta down\">▼ 0.3 pp</div></div>\n        <div class=\"kpi\"><div class=\"label\">NPS</div><div class=\"value\">52</div><div class=\"delta up\">▲ 4</div></div>\n      </div>\n      <section><h2>Top movers this week</h2>\n        <table><thead><tr><th>Metric</th><th>Value</th><th>Delta</th><th>Why</th></tr></thead><tbody>\n          <tr><td>Signups</td><td>389</td><td style=\"color:#16a34a\">+41%</td><td>Launch post on Hacker News drove 2K visits</td></tr>\n          <tr><td>Trial → paid</td><td>23%</td><td style=\"color:#16a34a\">+6pp</td><td>Shortened onboarding cut drop-off</td></tr>\n          <tr><td>API latency p99</td><td>142ms</td><td style=\"color:#dc2626\">+18ms</td><td>Cache warmup issue after deploy; mitigated</td></tr>\n        </tbody></table>\n      </section>\n      <section><h2>Takeaways</h2>\n        <div class=\"insight\"><strong>HN launch was a positive signal.</strong> 41% signup spike, 23% trial-to-paid conversion (up 6pp). Consider a second launch in 3 weeks with the new comparison post.</div>\n      </section>\n    </div></body></html>"
}
JSON

Raw HTML

report.html
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Weekly metrics report</title><style>
  *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
  body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; line-height: 1.6; color: #0f172a; background: #fff; }
  h1, h2, h3 { letter-spacing: -0.02em; }
  a { color: #2563eb; }
</style><style>
      body { background: #f8fafc; }
      .wrap { max-width: 960px; margin: 0 auto; padding: 40px 24px; }
      header { margin-bottom: 32px; }
      header h1 { font-size: 28px; font-weight: 700; }
      header p { color: #64748b; margin-top: 4px; }
      .kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 32px; }
      .kpi { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 20px; }
      .kpi .label { font-size: 12px; color: #64748b; text-transform: uppercase; letter-spacing: 0.08em; }
      .kpi .value { font-size: 28px; font-weight: 700; margin-top: 6px; }
      .kpi .delta { font-size: 13px; margin-top: 2px; }
      .delta.up { color: #16a34a; } .delta.down { color: #dc2626; }
      section { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; margin-bottom: 16px; }
      section h2 { font-size: 18px; margin-bottom: 16px; }
      table { width: 100%; border-collapse: collapse; font-size: 14px; }
      th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #e2e8f0; }
      th { color: #64748b; font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; }
      .insight { background: #fef3c7; border-left: 3px solid #f59e0b; padding: 16px; border-radius: 4px; font-size: 14px; color: #78350f; margin-top: 8px; }
      @media (max-width: 768px) { .kpis { grid-template-columns: 1fr 1fr; } }
    </style></head><body><div class="wrap">
      <header><h1>Weekly metrics — Apr 12–19, 2026</h1><p>Auto-generated by Claude · Published via ShipPage</p></header>
      <div class="kpis">
        <div class="kpi"><div class="label">MRR</div><div class="value">$48.2K</div><div class="delta up">▲ 8.4% WoW</div></div>
        <div class="kpi"><div class="label">Active users</div><div class="value">2,847</div><div class="delta up">▲ 12% WoW</div></div>
        <div class="kpi"><div class="label">Churn</div><div class="value">2.1%</div><div class="delta down">▼ 0.3 pp</div></div>
        <div class="kpi"><div class="label">NPS</div><div class="value">52</div><div class="delta up">▲ 4</div></div>
      </div>
      <section><h2>Top movers this week</h2>
        <table><thead><tr><th>Metric</th><th>Value</th><th>Delta</th><th>Why</th></tr></thead><tbody>
          <tr><td>Signups</td><td>389</td><td style="color:#16a34a">+41%</td><td>Launch post on Hacker News drove 2K visits</td></tr>
          <tr><td>Trial → paid</td><td>23%</td><td style="color:#16a34a">+6pp</td><td>Shortened onboarding cut drop-off</td></tr>
          <tr><td>API latency p99</td><td>142ms</td><td style="color:#dc2626">+18ms</td><td>Cache warmup issue after deploy; mitigated</td></tr>
        </tbody></table>
      </section>
      <section><h2>Takeaways</h2>
        <div class="insight"><strong>HN launch was a positive signal.</strong> 41% signup spike, 23% trial-to-paid conversion (up 6pp). Consider a second launch in 3 weeks with the new comparison post.</div>
      </section>
    </div></body></html>