HTML ad tag preview - Powered by Ad Reform

Live Preview

Tag didn’t load? Click here and let us know!
280x281
837 Bytes
Share this result

Previews are deleted daily. Get a permanent share link sent to your inbox:
Script

Open in browser
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Gojo Satoru | The Honored One</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
    <link href="https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&family=Space+Grotesk:wght@300;500&display=swap" rel="stylesheet">
    <style>
        :root {
            --gojo-blue: #00e5ff;
            --gojo-purple: #9d00ff;
            --deep-black: #050505;
        }

        body, html {
            margin: 0; padding: 0;
            background: var(--deep-black);
            color: white;
            font-family: 'Space+Grotesk', sans-serif;
            overflow: hidden;
        }

        /* --- PRE-ORDER / EXPENSIVE ENTRANCE --- */
        #entrance-overlay {
            position: fixed;
            inset: 0;
            background: black;
            z-index: 999;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
        }

        .eye-container {
            position: relative;
            width: 300px;
            height: 100px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .eye-glow {
            position: absolute;
            width: 150px;
            height: 5px;
            background: var(--gojo-blue);
            box-shadow: 0 0 50px var(--gojo-blue), 0 0 100px #fff;
            filter: blur(2px);
            transform: scaleX(0);
        }

        .click-text {
            position: absolute;
            bottom: -50px;
            font-family: 'Syncopate';
            font-size: 10px;
            letter-spacing: 5px;
            color: #444;
            animation: pulse 2s infinite;
        }

        /* --- MAIN DOMAIN --- */
        #domain-container {
            height: 100vh;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            opacity: 0;
            background: radial-gradient(circle at center, #110022 0%, #000 70%);
        }

        .gojo-render {
            width: 280px;
            z-index: 5;
            filter: drop-shadow(0 0 30px var(--gojo-purple));
            transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

        .gojo-render:hover {
            transform: scale(1.1) rotate(2deg);
        }

        .website-ui {
            background: rgba(255, 255, 255, 0.03);
            border: 1px solid rgba(0, 229, 255, 0.3);
            backdrop-filter: blur(20px);
            padding: 40px;
            border-radius: 40px;
            box-shadow: 0 40px 100px rgba(0,0,0,0.8);
            width: 380px;
            transform: translateY(50px);
            margin-top: -40px;
        }

        h1 {
            font-family: 'Syncopate';
            font-size: 24px;
            text-align: center;
            margin-bottom: 25px;
            background: linear-gradient(to right, #fff, var(--gojo-blue));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .input-group {
            margin-bottom: 15px;
        }

        input {
            width: 100%;
            padding: 18px;
            border-radius: 15px;
            border: 1px solid #222;
            background: rgba(0,0,0,0.5);
            color: var(--gojo-blue);
            font-weight: bold;
            outline: none;
            transition: 0.3s;
        }

        input:focus {
            border-color: var(--gojo-blue);
            box-shadow: 0 0 15px rgba(0, 229, 255, 0.1);
        }

        .btn-purple {
            width: 100%;
            padding: 20px;
            border-radius: 15px;
            border: none;
            background: linear-gradient(45deg, var(--gojo-purple), #6e00ff);
            color: white;
            font-family: 'Syncopate';
            font-size: 12px;
            font-weight: bold;
            cursor: pointer;
            box-shadow: 0 10px 30px rgba(157, 0, 255, 0.4);
            transition: 0.4s;
        }

        .btn-purple:hover {
            transform: scale(1.02);
            box-shadow: 0 15px 40px rgba(157, 0, 255, 0.6);
        }

        @keyframes pulse {
            0%, 100% { opacity: 0.3; }
            50% { opacity: 1; }
        }
    </style>
</head>
<body>

    <div id="entrance-overlay" onclick="revealDomain()">
        <div class="eye-container">
            <div class="eye-glow" id="left-eye"></div>
            <div class="click-text">CLICK TO EXPAND DOMAIN</div>
        </div>
    </div>

    <div id="domain-container">
        <img src="https://i.ibb.co/3ykXvWv/gojo-png.png" onerror="this.src='https://media.tenor.com/z_mSg2fB7mQAAAAC/gojo-satoru-smile.gif'" class="gojo-render" id="gojo-img">
        
        <div class="website-ui" id="ui-box">
            <h1>UNLIMITED VOID</h1>
            <div class="input-group">
                <input type="tel" id="p" placeholder="TARGET PHONE NUMBER">
            </div>
            <div class="input-group">
                <input type="number" id="c" placeholder="MESSAGES COUNT">
            </div>
            <button class="btn-purple" onclick="blast()">ACTIVATE HOLLOW PURPLE</button>
            <div id="status" style="text-align: center; margin-top: 15px; font-size: 11px; color: #888;"></div>
        </div>
    </div>

    <script>
        // Entrance Animation
        gsap.to(".eye-glow", { scaleX: 1, duration: 2, ease: "power4.inOut" });

        function revealDomain() {
            const tl = gsap.timeline();
            
            tl.to("#entrance-overlay", { backgroundColor: "rgba(255,255,255,1)", duration: 0.1 })
              .to("#entrance-overlay", { opacity: 0, display: "none", duration: 1 })
              .to("#domain-container", { opacity: 1, duration: 1 }, "-=0.5")
              .from("#gojo-img", { y: -200, opacity: 0, duration: 1.5, ease: "back.out" }, "-=0.5")
              .to("#ui-box", { y: 0, opacity: 1, duration: 1, ease: "power3.out" }, "-=1");
        }

        function blast() {
            let s = document.getElementById('status');
            s.innerHTML = "🌀 <span style='color:var(--gojo-blue)'>'Throughout heaven and earth, I alone am the honored one.'</span>";
            
            setTimeout(() => {
                s.innerHTML = "⚡ PURPLE PACKETS DEPLOYED...";
                s.style.color = "var(--gojo-purple)";
            }, 2000);
        }
    </script>
</body>
</html>
Landing Page

This ad does not have a landing page available
Network Timeline

Performance Summary

Requests
Domains
83KB
Transfer Size
131KB
Content Size
173.0ms
Dom Content Loaded
200.0ms
First Paint
244.0ms
Load Time
Domain Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests
Timings (ms)
Total Time
Content Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests