<!doctype html><html lang="nl"><head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Rainbow Islands CPC gratis online spelen – de PHP-remake in je browser</title> <meta name="description" content="Speel de Amstrad CPC-versie van Rainbow Islands gratis in je browser: 7 eilanden, 28 rondes, eindbazen, regenbogen en de originele muziek, opnieuw gemaakt in PHP met JumPHP. Toetsenbord, gamepad of touchscreen." /> <link rel="canonical" href="https://{{DOMAIN}}/nl/" /> <link rel="alternate" hreflang="fr" href="https://{{DOMAIN}}/" /> <link rel="alternate" hreflang="en" href="https://{{DOMAIN}}/en/" /> <link rel="alternate" hreflang="es" href="https://{{DOMAIN}}/es/" /> <link rel="alternate" hreflang="de" href="https://{{DOMAIN}}/de/" /> <link rel="alternate" hreflang="it" href="https://{{DOMAIN}}/it/" /> <link rel="alternate" hreflang="pt" href="https://{{DOMAIN}}/pt/" /> <link rel="alternate" hreflang="nl" href="https://{{DOMAIN}}/nl/" /> <link rel="alternate" hreflang="pl" href="https://{{DOMAIN}}/pl/" /> <link rel="alternate" hreflang="ru" href="https://{{DOMAIN}}/ru/" /> <link rel="alternate" hreflang="uk" href="https://{{DOMAIN}}/uk/" /> <link rel="alternate" hreflang="tr" href="https://{{DOMAIN}}/tr/" /> <link rel="alternate" hreflang="ja" href="https://{{DOMAIN}}/ja/" /> <link rel="alternate" hreflang="zh" href="https://{{DOMAIN}}/zh/" /> <link rel="alternate" hreflang="ko" href="https://{{DOMAIN}}/ko/" /> <link rel="alternate" hreflang="x-default" href="https://{{DOMAIN}}/" /> <meta name="robots" content="index, follow, max-image-preview:large" /> <meta name="theme-color" content="#1a3c8c" /> <link rel="icon" type="image/png" sizes="32x32" href="../images/favicon.png" /> <link rel="apple-touch-icon" href="../images/apple-touch-icon.png" /> <meta property="og:type" content="website" /> <meta property="og:locale" content="nl_NL" /> <meta property="og:site_name" content="Rainbow Islands CPC" /> <meta property="og:title" content="Rainbow Islands (Amstrad CPC) – online spelen" /> <meta property="og:description" content="Het CPC-Rainbow Islands opnieuw gemaakt in PHP, met de originele graphics en muziek: 7 eilanden, 28 rondes, gratis in je browser." /> <meta property="og:url" content="https://{{DOMAIN}}/nl/" /> <meta property="og:image" content="https://{{DOMAIN}}/images/og.png" /> <meta property="og:image:width" content="1200" /> <meta property="og:image:height" content="630" /> <meta property="og:image:alt" content="Het laadscherm van Rainbow Islands op de Amstrad CPC, tussen vier regenbogen" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="Rainbow Islands (Amstrad CPC) – online spelen" /> <meta name="twitter:description" content="7 eilanden, 28 rondes, eindbazen en de originele muziek, in je browser." /> <meta name="twitter:image" content="https://{{DOMAIN}}/images/og.png" /> <script type="application/ld+json"> { "@context": "https://schema.org", "@graph": [ { "@type": "VideoGame", "@id": "https://{{DOMAIN}}/nl/#game", "name": "Rainbow Islands (Amstrad CPC) – PHP-remake", "alternateName": "Rainbow Islands CPC", "url": "https://{{DOMAIN}}/nl/", "image": "https://{{DOMAIN}}/images/og.png", "screenshot": [ "https://{{DOMAIN}}/images/round-1.png", "https://{{DOMAIN}}/images/round-10.png", "https://{{DOMAIN}}/images/boss-28.png" ], "description": "In de browser speelbare remake van de Amstrad CPC-versie van Rainbow Islands: 7 eilanden, 28 rondes, eindbazen, regenbogen, stijgend water, met de originele graphics en muziek.", "genre": ["Platformspel", "Arcade", "Retro"], "gamePlatform": ["Webbrowser", "Computer", "Mobiel"], "applicationCategory": "Game", "operatingSystem": "Elke recente browser", "playMode": "SinglePlayer", "numberOfPlayers": {"@type": "QuantitativeValue", "value": 1}, "inLanguage": "nl", "isAccessibleForFree": true, "offers": {"@type": "Offer", "price": "0", "priceCurrency": "EUR", "availability": "https://schema.org/InStock"}, "codeRepository": "https://github.com/davidnurdin/rainbow-island", "potentialAction": {"@type": "PlayAction", "target": "https://{{DOMAIN}}/play/"} }, { "@type": "FAQPage", "mainEntity": [ {"@type": "Question", "name": "Moet ik iets installeren om te spelen?", "acceptedAnswer": {"@type": "Answer", "text": "Nee: het spel draait in de browser, op een computer of telefoon. Bij de eerste keer laden wordt ongeveer 10 MB gedownload, daarna staat alles in de cache."}}, {"@type": "Question", "name": "Hoe speel je het?", "acceptedAnswer": {"@type": "Answer", "text": "Pijltjes om te lopen, Omhoog of Z om te springen, Spatie of X voor een regenboog, P of Esc voor pauze. Een gamepad werkt ook; op een telefoon verschijnt een joystick onder je linkerduim."}}, {"@type": "Question", "name": "Is dit het originele spel?", "acceptedAnswer": {"@type": "Answer", "text": "Het is een remake: het programma is herschreven in PHP, maar de kaarten, sprites, het lettertype, het laadscherm, de muziek en de geluidseffecten komen van de Amstrad CPC-diskette uit 1989."}} ] } ] } </script> <style> :root { --sky: #1a3c8c; --sky-deep: #0b1840; --ink: #f4f1e8; --muted: #b9c3e6; --panel: #10265e; --line: #2d4fa8; --yellow: #ffd23f; --red: #e8382f; --cyan: #3fd0ff; --rainbow: linear-gradient(90deg, #c4161c, #f26a1b, #ffd23f, #3fbf3f, #1f8fff, #6a2fd0, #b02fb0); } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; background: var(--sky-deep); background-image: linear-gradient(180deg, var(--sky) 0, var(--sky-deep) 900px); color: var(--ink); font: 17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, sans-serif; } img { image-rendering: pixelated; image-rendering: crisp-edges; max-width: 100%; height: auto; display: block; } a { color: var(--yellow); } .wrap { max-width: 1080px; margin: 0 auto; padding: 0 16px; } .pixel { font-family: ui-monospace, "Cascadia Mono", "DejaVu Sans Mono", Menlo, Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; } .stripe { height: 8px; background: var(--rainbow); } header.hero { padding: 40px 0 56px; text-align: center; } .hero .arc { width: 192px; margin: 0 auto 8px; } .hero h1 { font-size: clamp(30px, 6vw, 58px); line-height: 1.1; margin: 0; color: var(--yellow); text-shadow: 4px 4px 0 var(--red); } .hero .sub { margin: 14px auto 0; max-width: 680px; font-size: clamp(17px, 2.2vw, 20px); color: var(--ink); } .cta { display: inline-block; margin-top: 28px; padding: 18px 34px; background: var(--yellow); color: #1a1a1a; text-decoration: none; font-weight: 800; font-size: 22px; border: 4px solid #1a1a1a; box-shadow: 6px 6px 0 var(--red); transition: transform .08s; } .cta:hover, .cta:focus-visible { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--red); } .hero .note { margin-top: 14px; font-size: 14px; color: var(--muted); } .hero .screen { margin: 40px auto 0; width: 100%; max-width: 768px; border: 6px solid #000; box-shadow: 0 0 0 4px var(--line), 0 20px 50px rgba(0, 0, 0, .5); } section { padding: 56px 0; } section + section { border-top: 2px solid var(--line); } h2 { font-size: clamp(22px, 3.4vw, 32px); margin: 0 0 18px; color: var(--yellow); } h3 { margin: 0 0 6px; font-size: 18px; color: var(--cyan); } p { margin: 0 0 14px; } .lead { color: var(--muted); max-width: 760px; } .grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); } figure { margin: 0; background: #000; border: 4px solid #000; box-shadow: 0 0 0 3px var(--line); } figcaption { background: var(--panel); padding: 8px 12px; font-size: 14px; color: var(--muted); } figcaption b { color: var(--ink); } .cards { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); } .card { background: var(--panel); border: 3px solid var(--line); padding: 18px; } kbd { display: inline-block; min-width: 1.8em; padding: 1px 7px; background: var(--ink); color: #111; border-radius: 3px; border-bottom: 3px solid #888; font: 600 14px/1.5 ui-monospace, monospace; text-align: center; } .split { display: grid; gap: 32px; grid-template-columns: 1fr 1fr; align-items: center; } @media (max-width: 760px) { .split { grid-template-columns: 1fr; } } details { background: var(--panel); border: 3px solid var(--line); padding: 14px 18px; margin-bottom: 12px; } summary { cursor: pointer; font-weight: 700; } details p { margin: 10px 0 0; color: var(--muted); } footer { padding: 32px 0 48px; font-size: 14px; color: var(--muted); text-align: center; } footer p { margin: 6px 0; } nav.langs { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 14px; margin: 0; padding: 10px 16px; font-size: 14px; line-height: 1.4; background: var(--sky-deep); } nav.langs a { color: var(--muted); text-decoration: none; padding: 2px 4px; } nav.langs a:hover, nav.langs a:focus-visible { color: var(--yellow); text-decoration: underline; } nav.langs a[aria-current] { color: var(--yellow); font-weight: 700; } </style></head><body> <div class="stripe"></div> <nav class="langs" aria-label="Taal"> <a href="../" hreflang="fr" lang="fr">Français</a> <a href="../en/" hreflang="en" lang="en">English</a> <a href="../es/" hreflang="es" lang="es">Español</a> <a href="../de/" hreflang="de" lang="de">Deutsch</a> <a href="../it/" hreflang="it" lang="it">Italiano</a> <a href="../pt/" hreflang="pt" lang="pt">Português</a> <a href="../nl/" hreflang="nl" lang="nl" aria-current="true">Nederlands</a> <a href="../pl/" hreflang="pl" lang="pl">Polski</a> <a href="../ru/" hreflang="ru" lang="ru">Русский</a> <a href="../uk/" hreflang="uk" lang="uk">Українська</a> <a href="../tr/" hreflang="tr" lang="tr">Türkçe</a> <a href="../ja/" hreflang="ja" lang="ja">日本語</a> <a href="../zh/" hreflang="zh" lang="zh">中文</a> <a href="../ko/" hreflang="ko" lang="ko">한국어</a> </nav> <header class="hero"> <div class="wrap"> <img class="arc" src="../images/rainbow.png" width="192" height="128" alt="" /> <h1 class="pixel">Rainbow Islands</h1> <p class="sub">Het Rainbow Islands van de <strong>Amstrad CPC</strong> (1989), opnieuw gemaakt in PHP en gratis speelbaar in je browser, met <strong>de originele graphics en muziek</strong>.</p> <a class="cta pixel" href="../play/?back=../nl/">▶ Spelen</a> <p class="note">Computer, telefoon of gamepad · niets te installeren · zonder account</p> <img class="screen" src="../images/round-1.png" width="512" height="352" alt="Bub op het eerste eiland, tussen de kasteeltorens, met een regenboog die voor hem is geworpen" /> </div> </header> <main> <section id="jeu"> <div class="wrap split"> <div> <h2>Klim omhoog voordat het water stijgt</h2> <p>Bub moet in elke ronde naar het bord <b>G</b> bovenaan klimmen terwijl de zee achter hem stijgt. Zijn wapen: <strong>regenbogen</strong>. Ze verdoven vijanden, dienen als bruggen en trappen, en als je na een sprong op er een landt, breek je hem: hij valt en verandert de vijanden die hij verplettert in diamanten.</p> <p><strong>7 eilanden, 28 rondes</strong>, een eindbaas aan het eind van elk eiland, fruit, bonussen, de waarschuwing <em>HURRY!</em>, het continue-scherm en het einde van het spel.</p> </div> <figure> <img src="../images/loading.png" width="640" height="400" loading="lazy" alt="Het originele laadscherm van Rainbow Islands op de Amstrad CPC" /> <figcaption><b>Het laadscherm</b> van de diskette uit 1989, ongewijzigd.</figcaption> </figure> </div> </section> <section id="iles"> <div class="wrap"> <h2>De zeven eilanden</h2> <p class="lead">Elk eiland heeft zijn eigen kleuren, vijanden en eindbaas. Screenshots van het spel zoals het in de browser draait.</p> <div class="grid"> <figure><img src="../images/round-1.png" width="512" height="352" loading="lazy" alt="Ronde 1, Insect Island: het kasteel en zijn vlaggen" /><figcaption><b>Insect Island</b> · ronde 1</figcaption></figure> <figure><img src="../images/round-6.png" width="512" height="352" loading="lazy" alt="Ronde 6, Combat Island: roze blokken op een oranje achtergrond, twee regenbogen" /><figcaption><b>Combat Island</b> · ronde 6</figcaption></figure> <figure><img src="../images/round-10.png" width="512" height="352" loading="lazy" alt="Ronde 10, Monster Island: een spookhuis in de nacht" /><figcaption><b>Monster Island</b> · ronde 10</figcaption></figure> <figure><img src="../images/round-15.png" width="512" height="352" loading="lazy" alt="Ronde 15, Toy Island: dobbelstenen en speelkaarten in de lucht" /><figcaption><b>Toy Island</b> · ronde 15</figcaption></figure> <figure><img src="../images/round-19.png" width="512" height="352" loading="lazy" alt="Ronde 19, Doh's Island: stenen uit een breakout-spel" /><figcaption><b>Doh's Island</b> · ronde 19</figcaption></figure> <figure><img src="../images/round-26.png" width="512" height="352" loading="lazy" alt="Ronde 26, Dragon Island: een muur van rode bakstenen" /><figcaption><b>Dragon Island</b> · ronde 26</figcaption></figure> <figure><img src="../images/boss-4.png" width="512" height="352" loading="lazy" alt="De eindbaas van het eerste eiland, een reuzenspin" /><figcaption><b>De eerste eindbaas</b> · ronde 4</figcaption></figure> <figure><img src="../images/boss-28.png" width="512" height="352" loading="lazy" alt="De draak, de laatste eindbaas van het spel" /><figcaption><b>De laatste eindbaas</b> · ronde 28</figcaption></figure> </div> </div> </section> <section id="commandes"> <div class="wrap"> <h2>Besturing</2>> <div class="cards"> <div class="card"> <h3>Toetsenbord</3>> <p><kbd>←</kbd> <kbd>→</kbd> lopen<br /> <kbd>↑</kbd> of <kbd>Z</kbd> springen<br /> <kbd>Spatie</kbd> of <kbd>X</kbd> regenboog<br /> <kbd>P</kbd> of <kbd>Esc</kbd> pauze</p> </div> <div class="card"> <h3>Gamepad</3>> <p>Stick of d-pad om te lopen, <b>A</b> om te springen, <b>X</b> of <b>B</b> voor de regenboog, <b>Start</b> voor pauze. Sluit hem aan voor of tijdens het spel.</p> </div> <div class="card"> <h3>Telefoon</3>> <p>Een joystick verschijnt onder je linkerduim, overal op de linkerhelft van het scherm; rechts de knoppen <b>JUMP</b> en <b>RAINBOW</b>. Houd de telefoon horizontaal.</p> </div> </div> <p style="margin-top: 28px; text-align: center"><a class="cta pixel" href="../play/?back=../nl/">▶ Nu spelen</a></p> </div> </section> <section id="remake"> <div class="wrap split"> <div> <h2>Hoe deze remake is gemaakt</h2> <p>Er is niets opnieuw getekend: de originele diskette draaide in een <strong>Amstrad CPC-emulator</strong> zonder scherm, die elke schrijfactie naar het geheugen en elke gespeelde noot noteerde. Daaruit zijn de kaarten van de 28 rondes, de tiles, sprites, het lettertype, de paletten, de muziek en de geluidseffecten gehaald.</p> <p>Het spel is daarna herschreven in leesbare <strong>PHP</strong> met de engine <a href="https://github.com/davidnurdin/jumPhp">JumPHP</a>: dezelfde code draait in een venster op de computer en in de browser, waar PHP wordt gecompileerd naar <strong>WebAssembly</strong>.</p> <p>De extractietools zijn gepubliceerd in <a href="https://github.com/davidnurdin/dsk2jumphp">dsk2jumphp</a>, en de code van het spel in <a href="https://github.com/davidnurdin/rainbow-island">rainbow-island</a>.</p> </div> <figure> <img src="../images/title.png" width="512" height="352" loading="lazy" alt="Het titelscherm met het originele CPC-lettertype" /> <figcaption><b>Het titelscherm</b>, met het van de diskette gehaalde CPC-lettertype.</figcaption> </figure> </div> </section> <section id="questions"> <div class="wrap"> <h2>Vragen</2>> <details> <summary>Moet ik iets installeren?</summary> <p>Nee: het spel draait in de browser, op een computer of telefoon. Bij de eerste keer laden wordt ongeveer 10 MB gedownload (PHP in WebAssembly en het spel), daarna staat alles in de cache.</p> </details> <details> <summary>Is dit het originele spel?</summary> <p>Het is een remake: het programma is herschreven in PHP, maar de kaarten, sprites, het lettertype, het laadscherm, de muziek en de geluidseffecten komen van de Amstrad CPC-diskette uit 1989.</p> </details> <details> <summary>Worden scores opgeslagen?</summary> <p>Je hoogste score en de opties (volume, taal) blijven in je browser.</p> </details> <details> <summary>Kan ik buiten de browser spelen?</summary> <p>Ja: met de broncode en Docker opent <code>bin/jumphp run rainbow-island</code> het spel in een venster, met geluid. Zie de <a href="https://github.com/davidnurdin/rainbow-island">GitHub-repository</a>.</p> </details> </div> </section> </main> <div class="stripe"></div> <footer> <div class="wrap"> <p>Gratis fanremake zonder reclame, gemaakt met <a href="https://github.com/davidnurdin/jumPhp">JumPHP</a>.</p> <p>Rainbow Islands © Taito Corporation 1987; Amstrad CPC-versie © Graftgold 1989, uitgegeven door Ocean. Dit project is niet verbonden aan een van deze bedrijven; de graphics en muziek behoren toe aan hun makers.</p> </div> </footer></body></html>