SPRITEWORKS - Samin Sami

by Samin Sami

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SPRITEWORKS — Handcrafted pixel games from a two-person studio</title>
<meta name="description" content="Spriteworks is a tiny studio making pixel-perfect games with heart. Play our catalogue, meet the team of two, and press start.">
<meta property="og:title" content="SPRITEWORKS — Handcrafted pixel games">
<meta property="og:description" content="A two-person studio making pixel-perfect games with heart. Press start.">
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%231a1030'/%3E%3Crect x='5' y='3' width='6' height='6' fill='%23ffd45e'/%3E%3Crect x='4' y='9' width='8' height='4' fill='%23ff6b8b'/%3E%3Crect x='4' y='13' width='2' height='2' fill='%232b1a4a'/%3E%3Crect x='10' y='13' width='2' height='2' fill='%232b1a4a'/%3E%3C/svg%3E">
<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=Press+Start+2P&family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
  :root{
    /* Day palette */
    --sky-1:#8fd3ff; --sky-2:#d4f0ff; --sky-3:#fff0d4;
    --ground:#3a7a3a; --ground-dark:#2b5a2b;
    --ink:#1a1030; --paper:#fff8ec;
    --hot:#ff6b8b; --gold:#ffd45e; --grape:#7b4fd0; --cyan:#3fd0d0;
    --panel:#1f1440; --panel-2:#2b1a5a; --line:rgba(255,255,255,.14);
    --text:#fff8ec; --muted:#b9a9e0;
    --coin:#ffd45e;
  }
  html[data-mode="night"]{
    --sky-1:#0c1030; --sky-2:#161a44; --sky-3:#2a1a52;
    --ground:#1e2a4a; --ground-dark:#141d38;
    --hot:#ff8bb0; --gold:#ffe58a; --grape:#a074ff; --cyan:#5ff0ff;
    --text:#fff8ec; --muted:#a99ad4;
  }
  *{margin:0;padding:0;box-sizing:border-box}
 ...