<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <!-- Primary meta -->
    <title>Tempo | Prompt. Develop. Design. Collaborate.</title>
    <meta
      name="description"
      content="Discover AI-powered tools at Tempo to prompt, develop, and design code effortlessly. Collaborate seamlessly with advanced solutions for faster, smarter web development."
    />
    <link rel="canonical" href="https://www.tempo.new/" />

    <!-- Icons -->
    <link rel="icon" href="/favicon.ico" type="image/x-icon" sizes="16x16 32x32" />
    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />

    <!-- Open Graph -->
    <meta property="og:title" content="Tempo | Prompt. Develop. Design. Collaborate." />
    <meta
      property="og:description"
      content="Discover AI-powered tools at Tempo to prompt, develop, and design code effortlessly. Collaborate seamlessly with advanced solutions for faster, smarter web development."
    />
    <meta property="og:url" content="https://www.tempo.new/" />
    <meta property="og:type" content="website" />
    <meta property="og:site_name" content="Tempo" />
    <meta property="og:image" content="https://www.tempo.new/og-image.png" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image:alt" content="Tempo — Prompt, Develop, Design, Collaborate" />

    <!-- Twitter -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@Tempo_Labs" />
    <meta name="twitter:title" content="Tempo | Prompt. Develop. Design. Collaborate." />
    <meta
      name="twitter:description"
      content="Discover AI-powered tools at Tempo to prompt, develop, and design code effortlessly. Collaborate seamlessly with advanced solutions for faster, smarter web development."
    />
    <meta name="twitter:image" content="https://www.tempo.new/og-image.png" />

    <!-- Marketing site display face (hero headings) -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Hedvig+Letters+Serif:opsz@12..24&display=swap"
      rel="stylesheet"
    />

    <!-- InterVariable preload (body fallback for non-Apple platforms —
         Windows, Linux, Android). @font-face declaration lives in
         styles.css; preloading the woff2 here lets the browser fetch
         it in parallel with the CSS instead of waiting for the
         stylesheet to parse first. -->
    <link
      rel="preload"
      as="font"
      type="font/woff2"
      href="/fonts/InterVariable.woff2"
      crossorigin
    />
    <script type="module" crossorigin src="/assets/index-CZFrNh10.js"></script>
    <link rel="stylesheet" crossorigin href="/assets/index-CXCcIXNF.css">
  </head>
  <body>
    <div id="root"></div>
  </body>
</html>
