Live Preview
Tag didn’t load? Click here and let us know!Share this result
Previews are deleted daily. Get a permanent share link sent to your inbox:
Script
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Creator Navigator | Performance Creative Agency</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap" rel="stylesheet">
<style>
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Inter',sans-serif;
scroll-behavior:smooth;
}
body{
background:#0b0b0f;
color:#fff;
overflow-x:hidden;
}
header{
position:fixed;
width:100%;
top:0;
left:0;
padding:25px 8%;
display:flex;
justify-content:space-between;
align-items:center;
background:rgba(10,10,15,0.7);
backdrop-filter:blur(10px);
z-index:1000;
}
header h2{
font-weight:800;
letter-spacing:1px;
}
header nav a{
color:#aaa;
text-decoration:none;
margin-left:30px;
transition:0.3s;
font-size:14px;
}
header nav a:hover{
color:#fff;
}
section{
padding:120px 8%;
}
.hero{
height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
}
.hero h1{
font-size:60px;
font-weight:800;
max-width:900px;
line-height:1.2;
background:linear-gradient(90deg,#fff,#888);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.hero p{
margin-top:25px;
color:#aaa;
max-width:650px;
font-size:18px;
}
.btn{
margin-top:35px;
padding:14px 35px;
border:1px solid #fff;
background:transparent;
color:#fff;
text-decoration:none;
font-weight:600;
transition:0.4s;
}
.btn:hover{
background:#fff;
color:#000;
}
.stats{
display:flex;
justify-content:space-around;
text-align:center;
flex-wrap:wrap;
}
.stat-box{
margin:30px;
}
.stat-box h3{
font-size:42px;
font-weight:700;
}
.stat-box p{
color:#888;
margin-top:10px;
}
.section-title{
text-align:center;
font-size:40px;
margin-bottom:70px;
font-weight:700;
}
.portfolio-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:40px;
}
.card{
background:rgba(255,255,255,0.05);
border:1px solid rgba(255,255,255,0.1);
border-radius:15px;
padding:25px;
transition:0.4s;
backdrop-filter:blur(15px);
}
.card:hover{
transform:translateY(-10px);
border:1px solid #fff;
}
.card iframe{
width:100%;
height:400px;
border-radius:10px;
margin-top:20px;
}
.services{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:40px;
}
.service-box{
padding:30px;
border:1px solid rgba(255,255,255,0.1);
border-radius:15px;
transition:0.4s;
}
.service-box:hover{
background:#fff;
color:#000;
}
.cta{
text-align:center;
padding:100px 8%;
background:linear-gradient(135deg,#111,#000);
}
.cta h2{
font-size:42px;
font-weight:700;
}
.cta p{
margin-top:20px;
color:#aaa;
}
footer{
text-align:center;
padding:40px;
color:#555;
font-size:14px;
border-top:1px solid rgba(255,255,255,0.1);
}
/* Scroll animation */
.reveal{
opacity:0;
transform:translateY(50px);
transition:all 1s ease;
}
.reveal.active{
opacity:1;
transform:translateY(0px);
}
@media(max-width:768px){
.hero h1{
font-size:38px;
}
}
</style>
</head>
<body>
<header>
<h2>Creator Navigator</h2>
<nav>
<a href="#portfolio">Case Studies</a>
<a href="#services">Services</a>
<a href="#contact">Apply</a>
</nav>
</header>
<section class="hero">
<h1>Creative That Scales Revenue.</h1>
<p>We engineer high-performance UGC ad creatives for DTC brands that want measurable growth — not just content.</p>
<a href="#contact" class="btn">Apply To Work With Us</a>
</section>
<section class="stats reveal">
<div class="stats">
<div class="stat-box">
<h3>4.2x</h3>
<p>Average ROAS</p>
</div>
<div class="stat-box">
<h3>27%</h3>
<p>Increase in CTR</p>
</div>
<div class="stat-box">
<h3>100M+</h3>
<p>Audience Reached</p>
</div>
</div>
</section>
<section id="portfolio" class="reveal">
<h2 class="section-title">Selected Case Studies</h2>
<div class="portfolio-grid">
<div class="card">
<h3>Skincare Brand</h3>
<p>Hook restructuring & testimonial angle that boosted conversions.</p>
<p><strong>Result:</strong> 3.8x ROAS</p>
<iframe src="https://www.youtube.com/embed/YOUR_VIDEO_ID"></iframe>
</div>
<div class="card">
<h3>Fitness Product</h3>
<p>Problem-solution ad creative engineered for paid campaigns.</p>
<p><strong>Result:</strong> +32% CTR</p>
<iframe src="https://www.youtube.com/embed/YOUR_VIDEO_ID"></iframe>
</div>
</div>
</section>
<section id="services" class="reveal">
<h2 class="section-title">What We Do</h2>
<div class="services">
<div class="service-box">
<h3>UGC Performance Ads</h3>
<p>Conversion-driven vertical creatives built for Meta & TikTok campaigns.</p>
</div>
<div class="service-box">
<h3>Creative Testing Framework</h3>
<p>Data-backed scripting, hooks & iterative optimization process.</p>
</div>
<div class="service-box">
<h3>Ad Creative Scaling</h3>
<p>Bulk creative production to scale profitable campaigns efficiently.</p>
</div>
</div>
</section>
<section id="contact" class="cta reveal">
<h2>Ready To Scale Your Brand?</h2>
<p>Serious brands only. Apply below to start your growth journey.</p>
<a href="mailto:your@email.com" class="btn">Apply Now</a>
</section>
<footer>
© 2026 Creator Navigator. All Rights Reserved.
</footer>
<script>
function reveal(){
var reveals=document.querySelectorAll(".reveal");
for(var i=0;i<reveals.length;i++){
var windowHeight=window.innerHeight;
var elementTop=reveals[i].getBoundingClientRect().top;
var elementVisible=100;
if(elementTop<windowHeight-elementVisible){
reveals[i].classList.add("active");
}
}
}
window.addEventListener("scroll",reveal);
</script>
</body>
</html>Landing Page
This ad does not have a landing page available
Network Timeline
Performance Summary
33
Requests
9
Domains
1055KB
Transfer Size
7258KB
Content Size
226.0ms
Dom Content Loaded
252.0ms
First Paint
1,610.0ms
Load Time
Domain Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...
Timings (ms)
Loading...
Total Time
Loading...
Content Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...