pricing.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Pricing — Web4</title>
  <meta name="description" content="Web4 pricing. Three plans, one node.">
  <meta name="theme-color" content="#000000">
  <meta property="og:type" content="website">
  <meta property="og:title" content="Web4 pricing">
  <meta property="og:description" content="Three plans, one node. Prices in HYPER.">
  <meta property="og:url" content="https://web4.rderg.com/pricing.html">
  <meta property="og:image" content="https://web4.rderg.com/og-image.png">
  <meta property="og:image:width" content="1200">
  <meta property="og:image:height" content="630">
  <meta property="og:image:alt" content="Web4 — web, supercharged">
  <meta name="twitter:card" content="summary_large_image">
  <link rel="icon" href="favicon.svg" type="image/svg+xml">
  <link rel="icon" href="icon-512.png" type="image/png" sizes="512x512">
  <link rel="apple-touch-icon" href="apple-touch-icon.png">
  <link rel="stylesheet" href="styles.css?v=2">
  <script src="script.js?v=2" defer></script>
</head>
<body>
  <main class="page">
    <a class="back" href="./">← Web4</a>

    <h1 class="section__title reveal">Pricing</h1>
    <p class="page__lede reveal">One node, three ways to pay for it. Prices are in HYPER, so think of the amount and it’s paid.</p>

    <div class="plans">
      <article class="plan reveal">
        <h2 class="plan__name">Free</h2>
        <p class="plan__price">0 <small>HYPER</small></p>
        <p class="plan__tagline">1 node</p>
        <ul class="plan__list">
          <li>Single node blockchain</li>
          <li>Unlimited HYPER</li>
          <li>STMU NFTs (they run hot)</li>
          <li>Support: soon</li>
        </ul>
        <a class="btn btn--ghost" href="build.html#quickstart">Start building</a>
      </article>

      <article class="plan plan--featured reveal">
        <h2 class="plan__name">Pro <span class="plan__badge">Most popular</span></h2>
        <p class="plan__price">4 <small>HYPER / mo</small></p>
        <p class="plan__tagline">1 node, but faster</p>
        <ul class="plan__list">
          <li>Everything in Free</li>
          <li>Finality: faster than instant</li>
          <li>Two turbos per NFT</li>
          <li>Support: soon, but sooner</li>
        </ul>
        <a class="btn" href="./#updates">Get notified <span class="btn__arrow" aria-hidden="true">→</span></a>
      </article>

      <article class="plan reveal">
        <h2 class="plan__name">Enterprise</h2>
        <p class="plan__price">Let’s talk</p>
        <p class="plan__tagline">1 node, contact us</p>
        <ul class="plan__list">
          <li>Everything in Pro</li>
          <li>A dedicated node (the same one)</li>
          <li>Uptime: 100%, in writing</li>
          <li>An account manager who agrees with you</li>
        </ul>
        <a class="btn btn--ghost" href="contact.html?topic=enterprise">Get in touch</a>
      </article>
    </div>

    <h2 class="page__heading reveal">Compare<br>plans</h2>
    <div class="table-wrap table-wrap--stack reveal">
      <table>
        <thead><tr><th scope="col"></th><th scope="col">Free</th><th scope="col">Pro</th><th scope="col">Enterprise</th></tr></thead>
        <tbody>
          <tr><td>Nodes</td><td data-label="Free">1</td><td data-label="Pro">1</td><td data-label="Enterprise">1</td></tr>
          <tr><td>Consensus</td><td data-label="Free">1/1</td><td data-label="Pro">1/1</td><td data-label="Enterprise">1/1</td></tr>
          <tr><td>Finality</td><td data-label="Free">Instant</td><td data-label="Pro">Faster than instant</td><td data-label="Enterprise">Whatever the contract says</td></tr>
          <tr><td>HYPER</td><td data-label="Free">Unlimited</td><td data-label="Pro">Unlimited</td><td data-label="Enterprise">Unlimited, in writing</td></tr>
          <tr><td>STMU NFTs</td><td data-label="Free">Hot</td><td data-label="Pro">Hotter</td><td data-label="Enterprise">Fireproof (soon)</td></tr>
          <tr><td>Uptime</td><td data-label="Free">100%</td><td data-label="Pro">100%</td><td data-label="Enterprise">100%, guaranteed</td></tr>
          <tr><td>Support</td><td data-label="Free">Soon</td><td data-label="Pro">Soon, but sooner</td><td data-label="Enterprise">Contact us</td></tr>
        </tbody>
      </table>
    </div>
  </main>

  <footer class="footer">
    <span>© <span id="year">2026</span> Web4</span>
    <nav class="footer__nav" aria-label="Pages">
      <a href="roadmap.html">Roadmap</a>
      <a href="testimonials.html">Testimonials</a>
      <a href="build.html">Build on Web4</a>
      <a href="testnet.html">Testnet</a>
      <a href="pricing.html" aria-current="page">Pricing</a>
      <a href="careers.html">Careers</a>
      <a href="contact.html">Contact</a>
      <a href="privacy.html">Privacy</a>
    </nav>
    <p class="prompt">
      <span class="prompt__sign" aria-hidden="true">$</span> web4 --pricing
      <span class="prompt__out">→ 0 HYPER</span><span class="cursor" aria-hidden="true"></span>
    </p>
  </footer>
</body>
</html>