<!DOCTYPE html><html lang="en" data-theme="dark"> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="icon" type="image/svg+xml" href="/favicon.svg"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><meta name="apple-itunes-app" content="app-id=6762527200"><meta name="theme-color" content="#07080a" media="(prefers-color-scheme: dark)"><meta name="theme-color" content="#f3f1ec" media="(prefers-color-scheme: light)"><title>Phosphor — A music visualizer for macOS</title><link rel="canonical" href="https://getphosphor.com/"><meta name="description" content="Phosphor turns any audio playing on your Mac into living, beat-synced visuals. $4.99, one-time, on the Mac App Store."><meta name="robots" content="index, follow"><meta property="og:title" content="Phosphor — A music visualizer for macOS"><meta property="og:type" content="website"><meta property="og:image" content="https://getphosphor.com/og-image.png"><meta property="og:url" content="https://getphosphor.com/"><meta property="og:description" content="Phosphor turns any audio playing on your Mac into living, beat-synced visuals. $4.99, one-time, on the Mac App Store."><meta property="og:locale" content="en_US"><meta property="og:site_name" content="Phosphor"><meta property="og:image:url" content="https://getphosphor.com/og-image.png"><meta property="og:image:width" content="1200"><meta property="og:image:height" content="630"><meta property="og:image:alt" content="Phosphor — Every track, made visible."><meta name="twitter:card" content="summary_large_image"><meta name="twitter:title" content="Phosphor — A music visualizer for macOS"><meta name="twitter:image" content="https://getphosphor.com/og-image.png"><meta name="twitter:description" content="Phosphor turns any audio playing on your Mac into living, beat-synced visuals. $4.99, one-time, on the Mac App Store."><script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Little Knife Labs","url":"https://littleknifelabs.com","email":"contact@littleknifelabs.com"}</script><script>
    (function () {
      try {
        var t = localStorage.getItem('phosphor-theme');
        if (t === 'light' || t === 'dark') document.documentElement.dataset.theme = t;
      } catch (e) {}
    })();
  </script><script src="/visualizer.js"></script><script async src="https://www.googletagmanager.com/gtag/js?id=G-V5KP0C1GM7"></script><script>(function(){const id = "G-V5KP0C1GM7";

      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', id);
    })();</script><script>
      function eventNameFor(link) {
        var explicit = link.dataset.analyticsEvent;
        if (explicit) return explicit;

        var context = link.dataset.appStoreContext || '';
        if (context.indexOf('nav') === 0) return 'app_store_cta_header';
        if (context === 'home:hero' || context.endsWith(':hero')) return 'app_store_cta_hero';
        if (context === 'home:final' || context.endsWith(':final')) return 'app_store_cta_footer';
        if (context.charAt(0) === '/') return 'seo_page_app_store_cta';
        return 'app_store_cta_hero';
      }

      document.addEventListener('click', (event) => {
        const target = event.target instanceof Element ? event.target : null;
        const link = target?.closest('[data-app-store-link]');
        if (!link || typeof gtag !== 'function') return;

        const payload = {
          link_url: link.href,
          link_text: link.textContent.trim(),
          link_context: link.dataset.appStoreContext || 'unknown',
          page_path: location.pathname,
        };

        gtag('event', 'app_store_click', payload);
        gtag('event', eventNameFor(link), payload);
      });
    </script><script type="application/ld+json">{"@context":"https://schema.org","@type":"SoftwareApplication","name":"Phosphor","applicationCategory":"MultimediaApplication","applicationSubCategory":"MusicApplication","operatingSystem":"macOS 14.4+","description":"A music visualizer for macOS. Phosphor turns any audio into living, beat-synced visuals. A growing catalog of hand-tuned scenes, real-time post-processing, works everywhere.","url":"https://getphosphor.com","image":"https://getphosphor.com/og-image.png","publisher":{"@type":"Organization","name":"Little Knife Labs","url":"https://littleknifelabs.com"},"featureList":["Three viewing modes: float, fullscreen, wallpaper","System-audio capture via Core Audio Process Tap","Real-time post-processing effects","AI Director auto-cycles scenes to match the music","Record visualizations to MP4","Apple Silicon native, Metal 3 GPU rendering"],"offers":{"@type":"Offer","url":"https://apps.apple.com/app/id6762527200","price":"4.99","priceCurrency":"USD","availability":"https://schema.org/InStock"}}</script><link rel="stylesheet" href="/_astro/Base.DmvzBEc8.css"></head> <body> <nav class="nav"> <div class="container nav-row"> <a href="/" class="brand" aria-label="Phosphor — home"><svg viewBox="0 0 300 64" height="26" fill="none" role="img" aria-label="Phosphor" xmlns="http://www.w3.org/2000/svg"> <!-- EQ mark: ghost tracks --> <g fill="var(--accent)" opacity="0.14"> <rect x="4" y="9" width="6" height="46" rx="2"></rect> <rect x="14" y="9" width="6" height="46" rx="2"></rect> <rect x="24" y="9" width="6" height="46" rx="2"></rect> <rect x="34" y="9" width="6" height="46" rx="2"></rect> <rect x="44" y="9" width="6" height="46" rx="2"></rect> </g> <!-- EQ mark: lit bars --> <g fill="var(--accent)"> <rect x="4" y="29" width="6" height="26" rx="2"></rect> <rect x="14" y="19" width="6" height="36" rx="2"></rect> <rect x="24" y="9" width="6" height="46" rx="2"></rect> <rect x="34" y="35" width="6" height="20" rx="2"></rect> <rect x="44" y="19" width="6" height="36" rx="2"></rect> </g> <!-- wordmark: inherits text color, theme-safe --> <text x="72" y="42" font-family="'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, sans-serif" font-size="30" font-weight="700" letter-spacing="3" fill="currentColor">PHOSPHOR</text> </svg></a> <div class="nav-links"> <a href="/#modes">Modes</a> <a href="/#scenes">Scenes</a> <a href="/#features">Features</a> <a href="/#uses">Uses</a> </div> <div class="nav-right"> <button class="theme-toggle" aria-label="Toggle theme" id="themeToggle"> <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true"> <circle cx="8" cy="8" r="3"></circle> <path d="M8 1v2M8 13v2M1 8h2M13 8h2M3.5 3.5l1.4 1.4M11.1 11.1l1.4 1.4M3.5 12.5l1.4-1.4M11.1 4.9l1.4-1.4"></path> </svg> </button> <a href="https://apps.apple.com/app/id6762527200" class="nav-cta" data-app-store-link data-app-store-context="nav" data-analytics-event="app_store_cta_header" aria-label="Download Phosphor on the Mac App Store">
App Store ↗
</a> <button class="hamburger" aria-label="Menu" id="ham" aria-expanded="false"> <span></span><span></span><span></span> </button> </div> </div> </nav> <div class="nav-drawer" id="drawer" aria-hidden="true"> <div class="nav-drawer-inner"> <a href="/#modes">Modes</a> <a href="/#scenes">Scenes</a> <a href="/#features">Features</a> <a href="/#uses">Uses</a> <div class="nav-drawer-foot"> <a href="https://apps.apple.com/app/id6762527200" class="btn btn-primary" data-app-store-link data-app-store-context="nav:drawer" data-analytics-event="app_store_cta_header">
Get on App Store ↗
</a> </div> </div> </div> <script>
  (function () {
    var ham = document.getElementById('ham');
    var drawer = document.getElementById('drawer');
    if (ham && drawer) {
      ham.addEventListener('click', function () {
        var open = drawer.classList.toggle('open');
        ham.classList.toggle('open', open);
        ham.setAttribute('aria-expanded', open ? 'true' : 'false');
        drawer.setAttribute('aria-hidden', open ? 'false' : 'true');
        document.body.style.overflow = open ? 'hidden' : '';
      });
      drawer.addEventListener('click', function (e) {
        var t = e.target;
        if (t === drawer || (t && t.tagName === 'A')) {
          drawer.classList.remove('open');
          ham.classList.remove('open');
          ham.setAttribute('aria-expanded', 'false');
          drawer.setAttribute('aria-hidden', 'true');
          document.body.style.overflow = '';
        }
      });
    }
    var btn = document.getElementById('themeToggle');
    if (btn) {
      btn.addEventListener('click', function () {
        var cur = document.documentElement.dataset.theme || 'dark';
        var next = cur === 'dark' ? 'light' : 'dark';
        document.documentElement.dataset.theme = next;
        try { localStorage.setItem('phosphor-theme', next); } catch (e) {}
      });
    }
  })();
</script>   <header class="hero" data-screen-label="01 Hero"> <canvas class="hero-canvas" data-scene="phosphor" id="heroCanvas" width="1920" height="1080" aria-hidden="true"></canvas> <div class="hero-overlay"></div> <div class="readout"> <div class="row"><span>Source</span><b>System Audio</b></div> <div class="row"><span>BPM</span><b>124</b></div> <div class="row"><span>Scene</span><b id="readoutScene">Phosphor</b></div> <div class="row"><span>Bass</span><span class="bar"><i id="readoutBass"></i></span></div> </div> <div class="container"> <div class="hero-eyebrow"> <span class="dot"></span> <span class="mono" style="font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;">
Live now on the Mac App Store
</span> </div> <h1>Every track, made <em>visible.</em></h1> <p class="lede">
Phosphor turns any audio playing on your Mac into <em>living, beat-synced visuals</em> — Spotify, Apple Music, YouTube, anything. No plugin, no account, no setup.
</p> <div class="hero-cta-row"> <a class="btn btn-primary" href="https://apps.apple.com/app/id6762527200" data-app-store-link data-app-store-context="home:hero" data-analytics-event="app_store_cta_hero">
Get Phosphor — $4.99 <span style="opacity: .6;">↗</span> </a> <a class="btn btn-ghost" href="#modes">See it in motion</a> </div> <div class="hero-meta"> <span><b>macOS 14.4+</b></span> <span><b>Apple Silicon</b></span> <span><b>One-time purchase</b></span> <span><b>No telemetry</b></span> </div> </div> <div class="hero-strip"> <div class="container" style="padding: 0;"> <div class="hero-strip-inner" id="heroStrip"> <div class="hero-strip-label">Now playing</div> <button class="scene-pill active" data-scene-pick="phosphor" data-scene-name="Phosphor" type="button"> <span class="num">01</span>Phosphor </button><button class="scene-pill" data-scene-pick="bassdrop" data-scene-name="Bassdrop" type="button"> <span class="num">02</span>Bassdrop </button><button class="scene-pill" data-scene-pick="bars" data-scene-name="VFD Bars" type="button"> <span class="num">03</span>VFD Bars </button><button class="scene-pill" data-scene-pick="tunnel" data-scene-name="Tunnel" type="button"> <span class="num">04</span>Tunnel </button><button class="scene-pill" data-scene-pick="orbits" data-scene-name="Orbits" type="button"> <span class="num">05</span>Orbits </button><button class="scene-pill" data-scene-pick="oscilloscope" data-scene-name="Oscilloscope" type="button"> <span class="num">06</span>Oscilloscope </button><button class="scene-pill" data-scene-pick="particles" data-scene-name="Particles" type="button"> <span class="num">07</span>Particles </button><button class="scene-pill" data-scene-pick="kaleido" data-scene-name="Kaleido" type="button"> <span class="num">08</span>Kaleido </button><button class="scene-pill" data-scene-pick="terrain" data-scene-name="Terrain" type="button"> <span class="num">09</span>Terrain </button><button class="scene-pill" data-scene-pick="nebula" data-scene-name="Nebula" type="button"> <span class="num">10</span>Nebula </button> <div class="meter" id="heroMeter"> <span style="opacity:0.4"></span><span style="opacity:0.4428571428571429"></span><span style="opacity:0.4857142857142857"></span><span style="opacity:0.5285714285714286"></span><span style="opacity:0.5714285714285714"></span><span style="opacity:0.6142857142857143"></span><span style="opacity:0.6571428571428571"></span><span style="opacity:0.7"></span><span style="opacity:0.7428571428571429"></span><span style="opacity:0.7857142857142858"></span><span style="opacity:0.8285714285714285"></span><span style="opacity:0.8714285714285714"></span><span style="opacity:0.9142857142857143"></span><span style="opacity:0.9571428571428572"></span> </div> </div> </div> </div> </header> <script>
  (function () {
    var canvas = document.getElementById('heroCanvas');
    var strip = document.getElementById('heroStrip');
    var readoutScene = document.getElementById('readoutScene');
    var readoutBass = document.getElementById('readoutBass');
    var meter = document.getElementById('heroMeter');
    if (!canvas || !strip) return;

    var pills = strip.querySelectorAll('[data-scene-pick]');
    var sceneIds = Array.prototype.map.call(pills, function (p) { return p.getAttribute('data-scene-pick'); });

    function setScene(id) {
      var name = id;
      Array.prototype.forEach.call(pills, function (p) {
        var match = p.getAttribute('data-scene-pick') === id;
        p.classList.toggle('active', match);
        if (match) name = p.getAttribute('data-scene-name') || id;
      });
      if (readoutScene) readoutScene.textContent = name;
      var palette = (window.PhosphorPalettes && window.PhosphorPalettes[id]) || null;
      if (canvas._phosphor) {
        canvas._phosphor.setScene(id);
        if (palette) canvas._phosphor.setPalette(palette);
      } else {
        canvas.setAttribute('data-scene', id);
        if (typeof window.PhosphorHydrate === 'function') window.PhosphorHydrate();
      }
    }

    Array.prototype.forEach.call(pills, function (p) {
      p.addEventListener('click', function () {
        setScene(p.getAttribute('data-scene-pick'));
      });
    });

    var idx = 0;
    setInterval(function () {
      idx = (idx + 1) % sceneIds.length;
      setScene(sceneIds[idx]);
    }, 9000);

    var meterBars = meter ? meter.querySelectorAll('span') : [];
    function tickMeter() {
      var t = performance.now() / 1000;
      var beat = (Math.sin(t * 2) + 1) / 2;
      if (readoutBass) readoutBass.style.width = (30 + beat * 70) + '%';
      Array.prototype.forEach.call(meterBars, function (b, i) {
        var h = 4 + Math.abs(Math.sin(t * 3 + i * 0.7)) * 14 + beat * 4;
        b.style.height = h + 'px';
      });
      requestAnimationFrame(tickMeter);
    }
    requestAnimationFrame(tickMeter);
  })();
</script> <div class="ticker" aria-hidden="true"> <div class="ticker-track"> <span class="ticker-item">VFD BARS</span><span class="ticker-item">PHOSPHOR</span><span class="ticker-item">RAY-MARCHED TUNNELS</span><span class="ticker-item">ORBITING SATELLITES</span><span class="ticker-item">OSCILLOSCOPE</span><span class="ticker-item">PARTICLE FIELDS</span><span class="ticker-item">STARFIELDS</span><span class="ticker-item">KALEIDOSCOPE</span><span class="ticker-item">TERRAIN FFT</span><span class="ticker-item">SUPERNOVA</span><span class="ticker-item">NEBULA</span><span class="ticker-item">VFD BARS</span><span class="ticker-item">PHOSPHOR</span><span class="ticker-item">RAY-MARCHED TUNNELS</span><span class="ticker-item">ORBITING SATELLITES</span><span class="ticker-item">OSCILLOSCOPE</span><span class="ticker-item">PARTICLE FIELDS</span><span class="ticker-item">STARFIELDS</span><span class="ticker-item">KALEIDOSCOPE</span><span class="ticker-item">TERRAIN FFT</span><span class="ticker-item">SUPERNOVA</span><span class="ticker-item">NEBULA</span><span class="ticker-item">VFD BARS</span><span class="ticker-item">PHOSPHOR</span><span class="ticker-item">RAY-MARCHED TUNNELS</span><span class="ticker-item">ORBITING SATELLITES</span><span class="ticker-item">OSCILLOSCOPE</span><span class="ticker-item">PARTICLE FIELDS</span><span class="ticker-item">STARFIELDS</span><span class="ticker-item">KALEIDOSCOPE</span><span class="ticker-item">TERRAIN FFT</span><span class="ticker-item">SUPERNOVA</span><span class="ticker-item">NEBULA</span><span class="ticker-item">VFD BARS</span><span class="ticker-item">PHOSPHOR</span><span class="ticker-item">RAY-MARCHED TUNNELS</span><span class="ticker-item">ORBITING SATELLITES</span><span class="ticker-item">OSCILLOSCOPE</span><span class="ticker-item">PARTICLE FIELDS</span><span class="ticker-item">STARFIELDS</span><span class="ticker-item">KALEIDOSCOPE</span><span class="ticker-item">TERRAIN FFT</span><span class="ticker-item">SUPERNOVA</span><span class="ticker-item">NEBULA</span> </div> </div> <section id="modes" data-screen-label="02 Modes"> <div class="container"> <div class="section-header"> <div class="section-eyebrow">Three ways to watch</div> <h2>Pick a mode. <em>Press play.</em></h2> <p>One app, three placements. Floating, fullscreen, or living behind every window on your desktop.</p> </div> <div class="modes-grid"> <div class="mode-card"> <div class="mode-stage float-stage">  <div class="float-bg"></div> <div class="float-tag"><span></span><span></span><span></span></div> <div class="float-window"><canvas data-scene="oscilloscope" width="1280" height="960" aria-hidden="true"></canvas></div>    </div> <div class="mode-meta"> <div class="mode-name">01 · Float</div> <h3 class="mode-title">Always on top</h3> <p class="mode-desc">A small borderless window that hovers while you work. Drag anywhere to move, corner-drag to resize.</p> <div class="mode-shortcut"> <span class="kbd">drag</span><span>to move</span> </div> </div> </div> <div class="mode-card"> <div class="mode-stage fullscreen-stage">  <canvas data-scene="bassdrop" width="1280" height="960" aria-hidden="true"></canvas>  </div> <div class="mode-meta"> <div class="mode-name">02 · Fullscreen</div> <h3 class="mode-title">Edge to edge</h3> <p class="mode-desc">Put on an album, hit ⌘F, lean back. Press Esc to return to float. Built for Apple Silicon at native frame-rate.</p> <div class="mode-shortcut"> <span class="kbd">⌘</span><span class="kbd">F</span><span>to enter</span> </div> </div> </div> <div class="mode-card"> <div class="mode-stage wallpaper-stage">    <canvas data-scene="nebula" data-crt="false" width="1280" height="800" aria-hidden="true"></canvas> <div class="wall-icons"> <div class="wall-icon"> <div class="wall-icon-tile"></div> <span class="wall-icon-label">Macintosh HD</span> </div><div class="wall-icon"> <div class="wall-icon-tile"></div> <span class="wall-icon-label">Downloads</span> </div><div class="wall-icon"> <div class="wall-icon-tile"></div> <span class="wall-icon-label">Mixes</span> </div><div class="wall-icon"> <div class="wall-icon-tile"></div> <span class="wall-icon-label">Phosphor.app</span> </div> </div>  </div> <div class="mode-meta"> <div class="mode-name">03 · Wallpaper</div> <h3 class="mode-title">Behind your icons</h3> <p class="mode-desc">Phosphor becomes your desktop. Animated behind icons and windows. Your whole screen breathes with the music.</p> <div class="mode-shortcut"> <span class="kbd">⌘</span><span class="kbd">W</span><span>to set as wallpaper</span> </div> </div> </div> </div> </div> </section> <section class="scenes-section" id="scenes" data-screen-label="03 Scenes"> <div class="container"> <div class="section-header"> <div class="section-eyebrow">100+ scenes · all hand-tuned</div> <h2>One for <em>every mood.</em></h2> <p>From subdued nebulae for late-night listening to ray-marched tunnels for the drop. Stack post-effects on any of them.</p> </div> </div> <div class="scenes-marquee"> <div class="scenes-track"> <div class="scene-card"> <img src="/media/scenes/phosphor.png" alt="Phosphor scene" loading="lazy" width="320" height="240"> <div class="scene-tag">01 · Phosphor</div> </div><div class="scene-card"> <img src="/media/scenes/bassdrop.png" alt="Bassdrop scene" loading="lazy" width="320" height="240"> <div class="scene-tag">02 · Bassdrop</div> </div><div class="scene-card"> <img src="/media/scenes/rainbowbars.png" alt="Rainbow Bars scene" loading="lazy" width="320" height="240"> <div class="scene-tag">03 · Rainbow Bars</div> </div><div class="scene-card"> <img src="/media/scenes/tunnelflythru.png" alt="Tunnel scene" loading="lazy" width="320" height="240"> <div class="scene-tag">04 · Tunnel</div> </div><div class="scene-card"> <img src="/media/scenes/nebula.png" alt="Nebula scene" loading="lazy" width="320" height="240"> <div class="scene-tag">05 · Nebula</div> </div><div class="scene-card"> <img src="/media/scenes/orbits.png" alt="Orbits scene" loading="lazy" width="320" height="240"> <div class="scene-tag">06 · Orbits</div> </div><div class="scene-card"> <img src="/media/scenes/supernova.png" alt="Supernova scene" loading="lazy" width="320" height="240"> <div class="scene-tag">07 · Supernova</div> </div><div class="scene-card"> <img src="/media/scenes/kaleido.png" alt="Kaleido scene" loading="lazy" width="320" height="240"> <div class="scene-tag">08 · Kaleido</div> </div><div class="scene-card"> <img src="/media/scenes/oscilloscope.png" alt="Oscilloscope scene" loading="lazy" width="320" height="240"> <div class="scene-tag">09 · Oscilloscope</div> </div><div class="scene-card"> <img src="/media/scenes/terrainfft.png" alt="Terrain FFT scene" loading="lazy" width="320" height="240"> <div class="scene-tag">10 · Terrain FFT</div> </div><div class="scene-card"> <img src="/media/scenes/phosphor.png" alt="Phosphor scene" loading="lazy" width="320" height="240"> <div class="scene-tag">01 · Phosphor</div> </div><div class="scene-card"> <img src="/media/scenes/bassdrop.png" alt="Bassdrop scene" loading="lazy" width="320" height="240"> <div class="scene-tag">02 · Bassdrop</div> </div><div class="scene-card"> <img src="/media/scenes/rainbowbars.png" alt="Rainbow Bars scene" loading="lazy" width="320" height="240"> <div class="scene-tag">03 · Rainbow Bars</div> </div><div class="scene-card"> <img src="/media/scenes/tunnelflythru.png" alt="Tunnel scene" loading="lazy" width="320" height="240"> <div class="scene-tag">04 · Tunnel</div> </div><div class="scene-card"> <img src="/media/scenes/nebula.png" alt="Nebula scene" loading="lazy" width="320" height="240"> <div class="scene-tag">05 · Nebula</div> </div><div class="scene-card"> <img src="/media/scenes/orbits.png" alt="Orbits scene" loading="lazy" width="320" height="240"> <div class="scene-tag">06 · Orbits</div> </div><div class="scene-card"> <img src="/media/scenes/supernova.png" alt="Supernova scene" loading="lazy" width="320" height="240"> <div class="scene-tag">07 · Supernova</div> </div><div class="scene-card"> <img src="/media/scenes/kaleido.png" alt="Kaleido scene" loading="lazy" width="320" height="240"> <div class="scene-tag">08 · Kaleido</div> </div><div class="scene-card"> <img src="/media/scenes/oscilloscope.png" alt="Oscilloscope scene" loading="lazy" width="320" height="240"> <div class="scene-tag">09 · Oscilloscope</div> </div><div class="scene-card"> <img src="/media/scenes/terrainfft.png" alt="Terrain FFT scene" loading="lazy" width="320" height="240"> <div class="scene-tag">10 · Terrain FFT</div> </div> </div> </div> </section> <section id="features" data-screen-label="04 Features"> <div class="container"> <div class="section-header"> <div class="section-eyebrow">Everything included · No accounts · No telemetry</div> <h2>One app. <em>No subscriptions.</em></h2> <p>Pay $4.99 once. Get every scene, every effect, every update. Your audio never leaves your Mac.</p> </div> <div class="feat-grid"> <div class="feat"> <div class="feat-num">01</div> <h3>Works with every music app</h3> <p>Apple Music, Spotify, Safari, YouTube — any audio your Mac plays, Phosphor visualizes via the Core Audio Process Tap.</p> <div class="feat-icon">→ core·audio·tap</div> </div><div class="feat"> <div class="feat-num">02</div> <h3>Real-time post-processing</h3> <p>Stack effects on any scene: kaleidoscope, glow, film grain, RGB split, beat-shake, scanlines. Tune every slider. Save presets.</p> <div class="feat-icon">→ 8 effects · stackable</div> </div><div class="feat"> <div class="feat-num">03</div> <h3>AI Director</h3> <p>Press R and let Phosphor pick scenes for you. It cycles automatically and matches scene energy to the music — high-contrast for EDM and dubstep drops, subtle for lofi and ambient, classical strings get the slow ones.</p> <div class="feat-icon">→ ⌥ R · auto-cycle</div> </div><div class="feat"> <div class="feat-num">04</div> <h3>Record to MP4</h3> <p>Capture your visuals with the audio that drove them. One click, saved to Movies. Share the moment.</p> <div class="feat-icon">→ mp4 · h.264 / hevc</div> </div><div class="feat"> <div class="feat-num">05</div> <h3>Media controls</h3> <p>Play, pause, and skip in Apple Music and Spotify without leaving the visualizer. Lives in the menu bar too.</p> <div class="feat-icon">→ ⌘ ← / →</div> </div><div class="feat"> <div class="feat-num">06</div> <h3>Apple Silicon native</h3> <p>Metal 3 GPU rendering throughout. Battery-aware: pauses when locked, drops to 30 fps on Low Power, idles when occluded.</p> <div class="feat-icon">→ metal 3 · 120 fps</div> </div> </div> </div> </section> <section id="uses" data-screen-label="05 Uses"> <div class="container"> <div class="section-header"> <div class="section-eyebrow">Popular uses</div> <h2>Start with <em>how you listen.</em></h2> </div> <div class="uses-grid"> <a class="use" href="/music-visualizer-for-mac/"> <div class="use-text"> <div class="use-name">Music visualizer for Mac</div> <div class="use-desc">getphosphor.com/music-visualizer-for-mac</div> </div> <div class="use-arrow">→</div> </a><a class="use" href="/spotify-visualizer-mac/"> <div class="use-text"> <div class="use-name">Spotify visualizer for Mac</div> <div class="use-desc">getphosphor.com/spotify-visualizer-mac</div> </div> <div class="use-arrow">→</div> </a><a class="use" href="/apple-music-visualizer-mac/"> <div class="use-text"> <div class="use-name">Apple Music visualizer for Mac</div> <div class="use-desc">getphosphor.com/apple-music-visualizer-mac</div> </div> <div class="use-arrow">→</div> </a><a class="use" href="/audio-reactive-wallpaper-mac/"> <div class="use-text"> <div class="use-name">Audio-reactive wallpaper</div> <div class="use-desc">getphosphor.com/audio-reactive-wallpaper-mac</div> </div> <div class="use-arrow">→</div> </a><a class="use" href="/record-music-visualizer-video/"> <div class="use-text"> <div class="use-name">Record visualizer videos</div> <div class="use-desc">getphosphor.com/record-music-visualizer-video</div> </div> <div class="use-arrow">→</div> </a><a class="use" href="/mac-music-visualizer-alternatives/"> <div class="use-text"> <div class="use-name">Mac visualizer alternatives</div> <div class="use-desc">getphosphor.com/mac-music-visualizer-alternatives</div> </div> <div class="use-arrow">→</div> </a> </div> </div> </section> <section class="final" data-screen-label="CTA"> <canvas class="final-canvas" data-scene="kaleido" width="1920" height="1080" aria-hidden="true"></canvas> <div class="container"> <div class="price">$4.99 · ONE-TIME · MAC APP STORE</div> <h2>Put on an album. Turn it <em>up.</em></h2> <p>macOS 14.4 or later. Apple Silicon. No subscription, ever.</p> <a class="btn btn-primary" href="https://apps.apple.com/app/id6762527200" data-app-store-link data-app-store-context="home:final" data-analytics-event="app_store_cta_footer">
Download on the App Store →
</a> </div> </section>  <footer> <div class="container"> <div class="foot-row"> <div><svg class="foot-logo" viewBox="0 0 300 64" height="18" fill="none" role="img" aria-label="Phosphor" xmlns="http://www.w3.org/2000/svg"> <!-- EQ mark: ghost tracks --> <g fill="var(--accent)" opacity="0.14"> <rect x="4" y="9" width="6" height="46" rx="2"></rect> <rect x="14" y="9" width="6" height="46" rx="2"></rect> <rect x="24" y="9" width="6" height="46" rx="2"></rect> <rect x="34" y="9" width="6" height="46" rx="2"></rect> <rect x="44" y="9" width="6" height="46" rx="2"></rect> </g> <!-- EQ mark: lit bars --> <g fill="var(--accent)"> <rect x="4" y="29" width="6" height="26" rx="2"></rect> <rect x="14" y="19" width="6" height="36" rx="2"></rect> <rect x="24" y="9" width="6" height="46" rx="2"></rect> <rect x="34" y="35" width="6" height="20" rx="2"></rect> <rect x="44" y="19" width="6" height="36" rx="2"></rect> </g> <!-- wordmark: inherits text color, theme-safe --> <text x="72" y="42" font-family="'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, sans-serif" font-size="30" font-weight="700" letter-spacing="3" fill="currentColor">PHOSPHOR</text> </svg> · Little Knife Labs LLC · © 2026</div> <div class="foot-links"> <a href="/press/">Press</a> <a href="/privacy/">Privacy</a> <a href="/support/">Support</a> <a href="/cdn-cgi/l/email-protection#f695999882979582b69a9f82829a939d989f90939a979485d895999b">Contact</a> </div> </div> </div> </footer> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script>
    (function () {
      var PALETTES = {
        phosphor: { fg: '#eaffea', accent: '#7cf6c8' },
        bassdrop: { fg: '#cfe0ff', accent: '#9ab8ff' },
        bars: { fg: '#ffffff', accent: '#ff5cd2' },
        tunnel: { fg: '#ffffff', accent: '#ff7be0' },
        orbits: { fg: '#fff5d6', accent: '#ffc24d' },
        oscilloscope: { fg: '#d6fff8', accent: '#3df0d2' },
        particles: { fg: '#e0e0ff', accent: '#9be0ff' },
        kaleido: { fg: '#ffe7fb', accent: '#ff7bd1' },
        terrain: { fg: '#dcffe9', accent: '#62f29c' },
        nebula: { fg: '#dadfff', accent: '#7c8cff' }
      };
      function hydrate() {
        if (!window.PhosphorViz) return;
        var nodes = document.querySelectorAll('canvas[data-scene]:not([data-viz-bound])');
        nodes.forEach(function (canvas) {
          canvas.setAttribute('data-viz-bound', '1');
          var scene = canvas.getAttribute('data-scene') || 'phosphor';
          var crt = canvas.getAttribute('data-crt') !== 'false';
          var instance = window.PhosphorViz.create(canvas, {
            scene: scene,
            crt: crt,
            palette: PALETTES[scene] || PALETTES.phosphor
          });
          canvas._phosphor = instance;
        });
      }
      if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', hydrate);
      } else {
        hydrate();
      }
      window.PhosphorHydrate = hydrate;
      window.PhosphorPalettes = PALETTES;
    })();
  </script> </body> </html>