<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>Onepost – Create once. Publish everywhere.</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@500;700;800&family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
:root{--bg:#ffffff;--card:#ffffff;--ink:#171717;--mute:#656565;--line:#ece7e7;--acc:#e11d2e;--accInk:#fff;--mint:#fff1f2;--warn:#e11d2e;--red:#e11d2e;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*:before,*:after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.7 "Poppins",system-ui,sans-serif}
h1,h2,h3{font-family:"Bricolage Grotesque","Poppins",sans-serif;line-height:1.05;margin:0;letter-spacing:-.02em}
h1{font-size:clamp(46px,9vw,104px);font-weight:800}
h2{font-size:clamp(30px,4.6vw,52px);font-weight:700}
h3{font-size:22px;font-weight:700;letter-spacing:-.01em}
p{margin:0 0 1em;max-width:62ch}
a{color:inherit}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.w{max-width:1120px;margin:0 auto;padding:0 24px}
section{padding:88px 0;border-top:1px solid var(--line)}
.mute{color:var(--mute)}
.btn{display:inline-block;padding:14px 24px;border-radius:999px;background:var(--acc);color:var(--accInk);font-weight:600;text-decoration:none}
.btn.o{background:none;color:var(--ink);border:1.5px solid var(--ink)}
header{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
header .w{display:flex;align-items:center;gap:24px;height:64px}
.logo{font:800 22px "Bricolage Grotesque",sans-serif;text-decoration:none;color:var(--acc)}.logo:after{content:".";color:var(--red)}
nav{display:flex;gap:22px;margin-left:auto;font-size:15px;overflow-x:auto}
nav a{text-decoration:none;color:var(--mute);white-space:nowrap}nav a:hover{color:var(--ink)}
header .btn{padding:9px 18px;font-size:15px;white-space:nowrap}
@media(max-width:820px){nav{display:none}header .btn{margin-left:auto}}
.hero{padding:72px 0 88px;border:0}h1 .r{color:var(--red)}.hero h1{animation:rise .8s cubic-bezier(.2,.8,.2,1) both}.hero .lead,.hero .cta{animation:rise .8s .15s both}@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.hero p.lead{font-size:20px;margin:28px 0}
.cta{display:flex;gap:12px;flex-wrap:wrap}
/* hero demo: one post fans out */
.demo{margin-top:56px;display:grid;grid-template-columns:1fr 1.2fr;gap:0;align-items:center}
.post{background:var(--card);border:1.5px solid var(--ink);border-radius:18px;padding:22px;position:relative;z-index:1}
.post .lines i{display:block;height:9px;border-radius:5px;background:var(--line);margin:9px 0}
.post .vid{height:110px;border-radius:10px;background:var(--mint);margin-bottom:14px;display:grid;place-items:center;font-weight:600}
.pub{margin-top:14px;width:100%;border:0;font:600 16px inherit;font-family:inherit;padding:12px;border-radius:10px;background:var(--red);color:var(--accInk);cursor:pointer}
.chips{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding-left:36px;position:relative}
.chips:before{content:"";position:absolute;left:0;top:50%;width:36px;border-top:2px dashed var(--acc)}
.chip{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;font-weight:500;transition:background .3s,border-color .3s,transform .4s cubic-bezier(.3,1.6,.5,1);position:relative}.chip:last-child{grid-column:1/-1}.chip.go{background:var(--mint);border-color:var(--acc);transform:scale(1.03)}.chip.go:after{content:"✓";position:absolute;right:-8px;top:-8px;width:22px;height:22px;border-radius:50%;background:var(--red);color:#fff;font-size:13px;display:grid;place-items:center;animation:pop .4s both}@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}.dot{position:absolute;left:0;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--red);opacity:0}.chips.run .dot{animation:fly .7s ease-in forwards}@keyframes fly{0%{opacity:1;left:0}100%{opacity:1;left:36px}}.post{animation:float 4s ease-in-out infinite}@keyframes float{50%{transform:translateY(-6px)}}
.chip b{font-size:13px;color:var(--mute);font-weight:500}
.chip.go b{color:var(--ink)}
@media(max-width:760px){.demo{grid-template-columns:1fr;gap:20px}.chips{padding-left:0}.chips:before{display:none}}
.plat{margin-top:28px;color:var(--mute);font-size:15px}
/* problem */
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
@media(max-width:760px){.two{grid-template-columns:1fr}}
.box{border:1px solid var(--line);border-radius:16px;padding:28px;background:var(--card)}
.box.hl{border:1.5px solid var(--ink)}
.box ul{list-style:none;padding:0;margin:14px 0 0}
.box li{padding:8px 0;border-top:1px solid var(--line)}
.box li:first-child{border:0}
.big{font:800 64px "Bricolage Grotesque",sans-serif;line-height:1}
/* features */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:40px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--card)}
.steps>div{padding:26px;border-right:1px solid var(--line)}.steps>div:last-child{border:0}
.steps .n{font:800 15px "Bricolage Grotesque";color:var(--acc);margin-bottom:26px}
@media(max-width:900px){.steps{grid-template-columns:1fr 1fr}.steps>div{border-bottom:1px solid var(--line)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}.steps>div{border-right:0}}
/* dashboard */
.dash{margin-top:40px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:700px){.kpis{grid-template-columns:1fr 1fr}}
.kpi{padding-bottom:14px;border-bottom:3px solid var(--acc)}.kpi:nth-child(even){border-color:var(--red)}
.kpi b{display:block;font:800 34px "Bricolage Grotesque"}
.kpi span{color:var(--mute);font-size:14px}.kpi em{font-style:normal;color:#e11d2e;font-weight:600;font-size:14px;margin-left:6px}
.bars{margin-top:24px;display:grid;gap:10px}
.bar{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:12px;font-size:14px}
.bar i{display:block;height:14px;border-radius:7px;background:var(--acc);transform-origin:left;transform:scaleX(0);transition:transform 1s cubic-bezier(.2,.8,.2,1)}.dash.in .bar i{transform:scaleX(1)}.bar:nth-child(2n) i{background:var(--red)}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;margin-top:12px}
@media(max-width:760px){.cols{grid-template-columns:1fr}}
.ins{background:var(--mint);border-left:6px solid var(--red);color:var(--ink);border-radius:16px;padding:26px}
.ins p{margin:0 0 14px}.ins strong{display:block;font-size:14px;margin-bottom:2px}
.ask{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.ask span{border:1px solid var(--line);background:var(--card);padding:8px 14px;border-radius:999px;font-size:15px}
/* lists */
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.tags span{padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-size:15px}
.ticks{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px}
.ticks li:before{content:"✓ ";color:var(--acc);font-weight:700}
@media(max-width:560px){.ticks{grid-template-columns:1fr}}
.flow{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.flow div{flex:1 1 150px;border-top:3px solid var(--acc)}.flow div:nth-child(even){border-color:var(--red)}.flow div{;padding:14px 0}
.flow b{display:block;font:700 20px "Bricolage Grotesque"}
.roles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:32px}
@media(max-width:800px){.roles{grid-template-columns:1fr 1fr}}
.cal{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.cal span{padding:8px 16px;border-radius:999px;font-weight:600;font-size:15px;background:var(--mint);color:var(--acc)}
.cal span.f{background:var(--red);color:#fff}.cal span.d{background:var(--line);color:var(--ink)}
details{border-top:1px solid var(--line);padding:18px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:600;font-size:18px}
details p{margin:12px 0 0;color:var(--mute)}
.final{background:linear-gradient(135deg,#d71920,#ef3340);color:#fff;border-radius:28px;padding:64px 32px;text-align:center;margin:0 24px}
.final p{margin:14px auto 28px}
.final .btn{background:#fff;color:var(--red)}
footer{padding:48px 0 32px;font-size:15px}
footer .g{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}
@media(max-width:700px){footer .g{grid-template-columns:1fr 1fr}}
footer a{display:block;color:var(--mute);text-decoration:none;padding:2px 0}footer h4{margin:0 0 8px;font-size:15px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* premium layer */
header{background:rgba(255,255,255,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
nav a{position:relative;padding:4px 0}nav a:after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .3s}nav a:hover:after{transform:scaleX(1)}
.hero{position:relative;overflow:hidden}
.hero:before,.hero:after{content:"";position:absolute;z-index:0;border-radius:50%;filter:blur(90px);opacity:.35;pointer-events:none}
.hero:before{width:420px;height:420px;background:#ffe2e5;right:-140px;top:-120px;opacity:.55}
.hero:after{width:320px;height:320px;background:#ffe1e5;left:-160px;bottom:-150px;opacity:.42}
@keyframes drift{to{transform:translate(60px,40px) scale(1.15)}}
.hero .w{position:relative;z-index:1}
.pill{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:600;font-size:15px;margin-bottom:24px;box-shadow:0 6px 20px rgba(29,78,216,.1)}
.pill i{width:9px;height:9px;border-radius:50%;background:var(--red);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(225,29,46,.6)}100%{box-shadow:0 0 0 12px rgba(225,29,46,0)}}
.btn{position:relative;transition:box-shadow .3s,background .3s,border-color .3s}
.btn:hover{box-shadow:0 12px 28px rgba(225,29,46,.20)}.btn.o:hover{background:var(--acc);color:#fff;border-color:var(--acc)}
.final .btn:hover{box-shadow:0 12px 28px rgba(0,0,0,.3)}
.post{animation:none;transition:box-shadow .3s;box-shadow:0 24px 55px -28px rgba(225,29,46,.18)}
.chip:hover{border-color:var(--red);transform:translateX(6px)}
.box,.steps>div,.tile,.kpi{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s}
.box:hover,.tile:hover{transform:translateY(-3px);box-shadow:0 16px 30px -20px rgba(225,29,46,.16);border-color:#f0c7cb}
.steps>div:hover{background:#fff9f9}
.tags span,.ask span{transition:transform .25s,background .25s,color .25s,border-color .25s;cursor:default}
.tags span:hover,.ask span:hover{background:var(--acc);color:#fff;border-color:var(--acc);transform:translateY(-3px)}
.flow div{transition:transform .3s,border-color .3s}.flow div:hover{transform:translateY(-6px);border-color:var(--red)}
.bar i{transition:transform 1s cubic-bezier(.2,.8,.2,1),filter .3s}.bar:hover i{filter:brightness(1.15)}
summary{transition:color .2s}details:hover summary{color:var(--acc)}
.ticks li{transition:transform .25s}.ticks li:hover{transform:translateX(6px)}
.rv{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}.rv.vis{opacity:1;transform:none}
/* all-in-one */
.aio{background:linear-gradient(180deg,#fff,#fff6f6)}
.grid6{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
@media(max-width:900px){.grid6{grid-template-columns:1fr 1fr}}@media(max-width:560px){.grid6{grid-template-columns:1fr}}
.tile{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px}
.tile .ic{width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--acc);display:grid;place-items:center;font-size:20px;margin-bottom:22px;transition:transform .5s,background .3s,color .3s}
.tile:hover .ic{background:var(--red);color:#fff;transform:rotate(360deg) scale(1.1)}
.tile p{color:var(--mute);margin:8px 0 14px;font-size:16px}
.tile small{font-weight:600;color:var(--acc);display:inline-block;transition:transform .3s}.tile:hover small{transform:translateX(6px)}
.replace{margin-top:32px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.replace s{color:var(--mute);padding:6px 12px;border:1px dashed var(--line);border-radius:999px;font-size:15px}
.replace b{color:var(--red)}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}
/* professional polish */
.hero .lead{max-width:650px;color:#53627f}
.hero .cta .btn{min-height:48px}
.hero .pill{box-shadow:0 8px 24px rgba(80,25,30,.06)}
.chip{box-shadow:0 5px 16px rgba(80,25,30,.04)}
.box,.tile,.steps,.dash{box-shadow:0 8px 24px rgba(80,25,30,.035)}
.auth{display:flex;align-items:center;gap:18px;margin-left:8px}
.login{font:500 14px "Poppins",sans-serif;text-decoration:none;color:var(--ink);white-space:nowrap}
.login:hover{color:var(--red)}
.auth .btn{font-family:"Poppins",sans-serif}
@media(max-width:820px){.auth{margin-left:auto}.login{display:none}}
.hero p.lead,.mute,.plat,.tile p,.ins p,.box p,.steps p,.flow div,.final p,details p,footer{
font-family:"Poppins",system-ui,sans-serif;
}
</style>
</head>
<body>
<header><div class="w">
<a class="logo" href="#">Onepost</a>
<nav><a href="#all">Platform</a><a href="#features">Features</a><a href="#how">How it works</a><a href="#analytics">Analytics</a><a href="#security">Security</a><a href="#platforms">Integrations</a><a href="#faq">FAQ</a></nav>
<div class="auth">
<a class="login" href="#login">Log in</a>
<a class="btn" href="#start">Get started</a>
</div>
</div></header>
<main>
<section class="hero"><div class="w">
<div class="pill"><i></i>The all-in-one social media platform</div>
<h1>Create once.<br><span class="r">Publish everywhere.</span></h1>
<p class="lead">Connect your social accounts, publish across platforms, track your performance, and get recommendations to improve your content, all from one secure dashboard.</p>
<div class="cta"><a class="btn" href="#start">Connect your accounts</a><a class="btn o" href="#how">See how it works</a></div>
<div class="demo" aria-label="Product demo">
<div class="post">
<div class="vid">30-second video</div>
<div class="lines"><i style="width:90%"></i><i style="width:70%"></i></div>
<button class="pub" id="pub" type="button">Publish to 5 platforms</button>
</div>
<div class="chips" id="chips"><span class="dot"></span>
<div class="chip">Instagram <b>Reel + caption</b></div><div class="chip">Facebook <b>Video</b></div>
<div class="chip">LinkedIn <b>Pro post</b></div><div class="chip">Threads <b>Short text</b></div>
<div class="chip">YouTube <b>Short</b></div>
</div>
</div>
<p class="plat">Connect, create, publish, analyze, improve. One platform for your whole social media workflow.</p>
</div></section>
<section><div class="w">
<h2>Still posting the same content everywhere?</h2>
<div class="two">
<div class="box"><h3>Today</h3><ul><li>Instagram: post</li><li>Facebook: post</li><li>LinkedIn: post</li><li>Threads: post</li><li>YouTube: post</li></ul>
<p class="mute" style="margin-top:16px">5 platforms. 5 logins. 5 uploads. 5 workflows.</p></div>
<div class="box hl"><div class="big">1</div><h3 style="margin-top:12px">With Onepost</h3><p style="margin-top:8px">Create your content once and distribute it across your connected platforms from one dashboard. Create, select platforms, publish. Then analyze, understand, improve.</p></div>
</div>
</div></section>
<section class="aio" id="all"><div class="w">
<h2>One platform. Your entire social workflow.</h2>
<p class="mute" style="margin-top:16px;font-size:19px">Stop paying for, logging into and learning six different tools. Onepost is the all-in-one solution for publishing, planning, measuring and improving your social presence.</p>
<div class="grid6">
<div class="tile"><div class="ic">➤</div><h3>Publishing</h3><p>Create once and send to every connected platform in a single click.</p><small>Replaces manual uploads →</small></div>
<div class="tile"><div class="ic">◷</div><h3>Scheduling</h3><p>Queue posts for the perfect time and let the platform handle the rest.</p><small>Replaces your scheduler →</small></div>
<div class="tile"><div class="ic">▦</div><h3>Content calendar</h3><p>See what is scheduled, published, in draft or failed, in one view.</p><small>Replaces your spreadsheet →</small></div>
<div class="tile"><div class="ic">▲</div><h3>Unified analytics</h3><p>Reach, engagement, followers and clicks from every platform together.</p><small>Replaces separate insights tabs →</small></div>
<div class="tile"><div class="ic">✦</div><h3>Smart recommendations</h3><p>Get told the best times, formats and topics, based on your own data.</p><small>Replaces guesswork →</small></div>
<div class="tile"><div class="ic">☺</div><h3>Team workspace</h3><p>Roles for admins, creators, reviewers and analysts. No shared passwords.</p><small>Replaces password sharing →</small></div>
</div>
<div class="replace"><b>Instead of</b><s>a scheduler</s><s>an analytics tool</s><s>a calendar sheet</s><s>5 different logins</s><b>use one dashboard.</b></div>
</div></section>
<section id="features"><div class="w">
<h2>Everything you need to manage your socials</h2>
<div class="steps">
<div><div class="n">1</div><h3>Connect your accounts</h3><p class="mute">Bring your accounts into one secure dashboard. Stop switching between apps.</p></div>
<div><div class="n">2</div><h3>Create once</h3><p class="mute">Write text and captions, add images, videos, links and hashtags, and tune content per platform.</p></div>
<div><div class="n">3</div><h3>Publish everywhere</h3><p class="mute">Pick your platforms and hit Publish. No manual uploading to each one.</p></div>
<div><div class="n">4</div><h3>Schedule ahead</h3><p class="mute">Plan your week, queue your posts and stay consistent.</p></div>
</div>
</div></section>
<section><div class="w cols">
<div><h2>Adapt every post to its platform</h2><p class="mute" style="margin-top:16px">Different platforms have different audiences. Adapt one idea instead of blindly copying the same format everywhere.</p>
<div class="tags"><span>Instagram: caption + Reel</span><span>LinkedIn: professional post + video</span><span>Threads: short text + video</span><span>Facebook: community caption</span><span>YouTube: title + Short</span></div></div>
<div><h2>Never lose track of what's posting</h2><p class="mute" style="margin-top:16px">Manage your whole content calendar in one place.</p>
<div class="cal"><span>Scheduled</span><span class="d">Drafts</span><span>Published</span><span class="f">Failed: needs attention</span></div>
<p style="margin-top:20px"><a class="btn o" href="#start">Open content calendar</a></p></div>
</div></section>
<section id="analytics"><div class="w">
<h2>Don't just post. Understand what works.</h2>
<p class="mute" style="margin-top:16px">Instead of checking Instagram Insights, LinkedIn Analytics and YouTube Studio one by one, get a unified view of your social performance.</p>
<div class="dash">
<div class="kpis">
<div class="kpi"><b>248.6K</b><span>Total reach</span><em>↑ 12.5%</em></div>
<div class="kpi"><b>12.4K</b><span>Engagement</span><em>↑ 8.7%</em></div>
<div class="kpi"><b>56.8K</b><span>Followers</span><em>↑ 4.2%</em></div>
<div class="kpi"><b>48</b><span>Posts published</span><em>↑ 15%</em></div>
</div>
<div class="bars" role="img" aria-label="Sample reach by platform">
<div class="bar">Instagram<i style="width:88%"></i></div><div class="bar">LinkedIn<i style="width:64%"></i></div>
<div class="bar">YouTube<i style="width:52%"></i></div><div class="bar">Facebook<i style="width:38%"></i></div>
<div class="bar">Threads<i style="width:24%"></i></div>
</div>
</div>
<p class="mute" style="margin-top:14px;font-size:14px">Sample data. Also tracked: impressions, clicks, and top-performing content.</p>
</div></section>
<section><div class="w cols">
<div><h2>Your analytics should tell you what to do next</h2>
<p class="mute" style="margin-top:16px">Numbers are useful. Recommendations are better. Instead of "Your engagement dropped this week," you get the reason: your recent posts got fewer interactions outside your usual publishing time.</p>
<div class="tags"><span>Better posting times</span><span>Formats to test</span><span>Top topics</span><span>Best platforms</span><span>Content to repurpose</span><span>Underperforming posts</span><span>Posting frequency</span></div></div>
<div class="ins">
<p><strong>Performance insight</strong>Your short-form video generated 42% more engagement than static posts this month.</p>
<p><strong>Recommendation</strong>Post more short-form video and test similar topics over the next 2 weeks.</p>
<p><strong>Best time</strong>Your audience is most active between 6:00 PM and 8:00 PM.</p>
<a class="btn" style="background:var(--red);color:#fff" href="#start">View my recommendations</a></div>
</div>
<div class="w"><h3 style="margin-top:56px">Ask your social dashboard</h3>
<div class="ask"><span>Which platform performed best this month?</span><span>What content gets the most engagement?</span><span>When should I post?</span><span>Why did my reach decrease?</span></div></div>
</section>
<section id="security"><div class="w">
<h2>Your accounts. Your access. Your control.</h2>
<p class="mute" style="margin-top:16px">Where supported, accounts connect through each platform's official authorization system. We never need to see your passwords.</p>
<ul class="ticks"><li>Encrypted credential handling</li><li>Secure authentication</li><li>Permission-based access</li><li>No password sharing with teammates</li><li>Disconnect any account anytime</li><li>Controlled platform permissions</li></ul>
<p class="mute" style="margin-top:20px;font-size:14px">Security features and authentication methods depend on each social platform and integration.</p>
</div></section>
<section id="how"><div class="w">
<h2>From idea to published post in minutes</h2>
<div class="flow">
<div><b>Connect</b>Link your accounts.</div><div><b>Create</b>Write it in the dashboard.</div><div><b>Select</b>Choose where it goes.</div>
<div><b>Publish</b>Now, or schedule it.</div><div><b>Analyze</b>See how it performs.</div><div><b>Improve</b>Act on recommendations.</div>
</div>
</div></section>
<section id="platforms"><div class="w cols">
<div><h2>Built for people who manage multiple accounts</h2>
<div class="tags"><span>Creators</span><span>Freelancers</span><span>Entrepreneurs</span><span>Influencers</span><span>Consultants</span><span>Coaches</span><span>Small businesses</span><span>Marketers</span></div>
<h3 style="margin-top:36px">Connect the channels you already use</h3>
<div class="tags"><span>Instagram</span><span>Facebook</span><span>LinkedIn</span><span>YouTube</span><span>Threads</span></div>
<p class="mute" style="margin-top:14px;font-size:14px">Available integrations may vary with each platform's API capabilities and permissions.</p></div>
<div><h2>One workspace for your social team</h2><p class="mute" style="margin-top:16px">Collaborate without sharing passwords. Give everyone the right access.</p>
<div class="roles" style="grid-template-columns:1fr 1fr">
<div class="box"><h3>Admin</h3><p class="mute" style="margin:6px 0 0">Manage accounts and settings.</p></div>
<div class="box"><h3>Creator</h3><p class="mute" style="margin:6px 0 0">Create and prepare content.</p></div>
<div class="box"><h3>Reviewer</h3><p class="mute" style="margin:6px 0 0">Review and approve posts.</p></div>
<div class="box"><h3>Analyst</h3><p class="mute" style="margin:6px 0 0">View performance and insights.</p></div></div></div>
</div></section>
<section id="faq"><div class="w" style="max-width:820px">
<h2 style="margin-bottom:28px">Frequently asked questions</h2>
<details><summary>Do I need to share my social media passwords?</summary><p>No. Where supported, accounts connect through the platform's official authentication and authorization systems.</p></details>
<details><summary>Can I publish to multiple platforms at once?</summary><p>Yes. Connect your supported accounts, create your content, select platforms and publish.</p></details>
<details><summary>Can I schedule posts?</summary><p>Yes. Schedule for later and manage upcoming posts from the content calendar.</p></details>
<details><summary>Can I see analytics from multiple platforms?</summary><p>Yes. Supported performance metrics come together in one dashboard.</p></details>
<details><summary>Does it automatically improve my content?</summary><p>It analyzes your available performance data and suggests improvements to content, timing and platform focus. Recommendations are suggestions based on your connected account data.</p></details>
<details><summary>Can I disconnect my social accounts?</summary><p>Yes, from your account settings, subject to each social platform's capabilities.</p></details>
<details><summary>Is my data secure?</summary><p>Onepost is built around secure authentication, encrypted handling of sensitive credentials where applicable, and permission-based access. Exact security and permissions depend on the integration.</p></details>
</div></section>
<section id="start" style="border:0;padding-top:24px"><div class="final">
<h2>One dashboard.<br>Every social.</h2>
<p>Connect your first account and simplify your social media workflow. Free to get started. No complicated setup.</p>
<a class="btn" href="#">Get started</a>
</div></section>
</main>
<footer><div class="w"><div class="g">
<div><b style="font:800 20px 'Bricolage Grotesque'">Onepost</b><p class="mute" style="margin-top:6px">All your socials. One platform.</p></div>
<div><h4>Product</h4><a href="#features">Publishing</a><a href="#features">Scheduling</a><a href="#analytics">Analytics</a><a href="#analytics">Recommendations</a></div>
<div><h4>Resources</h4><a href="#">Help center</a><a href="#">Documentation</a><a href="#">Blog</a><a href="#">API</a><a href="#">Status</a></div>
<div><h4>Company</h4><a href="#">About</a><a href="#">Contact</a><a href="#security">Security</a><a href="#">Privacy</a><a href="#">Terms</a></div>
</div><p class="mute" style="margin-top:32px;font-size:14px">© 2026 Onepost. All rights reserved.</p></div></footer>
<script>
(function(){
var c=document.getElementById('chips'),b=document.getElementById('pub'),chips=[].slice.call(c.querySelectorAll('.chip')),busy=false;
function run(){
if(busy)return;busy=true;b.textContent='Publishing…';c.classList.remove('run');void c.offsetWidth;c.classList.add('run');
chips.forEach(function(x,i){setTimeout(function(){x.classList.add('go')},500+i*260)});
setTimeout(function(){b.textContent='Published to 5 platforms'},500+chips.length*260);
setTimeout(function(){chips.forEach(function(x){x.classList.remove('go')});c.classList.remove('run');b.textContent='Publish to 5 platforms';busy=false},4600);
}
b.addEventListener('click',run);
setTimeout(run,900);setInterval(run,7000);
var d=document.querySelector('.dash');
if('IntersectionObserver' in window){new IntersectionObserver(function(e,o){if(e[0].isIntersecting){d.classList.add('in');o.disconnect()}},{threshold:.3}).observe(d)}else{d.classList.add('in')}
})();
</script>
<script>
(function(){
var rm=window.matchMedia('(prefers-reduced-motion:reduce)').matches;
// Subtle scroll reveal only. No custom cursor, magnetic buttons, or 3D cursor effects.
var els=[].slice.call(document.querySelectorAll('section h2,.tile,.box,.steps>div,.flow div,.roles .box,.dash,.ins,details'));
if('IntersectionObserver' in window && !rm){
var io=new IntersectionObserver(function(entries){
entries.forEach(function(entry){
if(entry.isIntersecting){
entry.target.classList.add('vis');
io.unobserve(entry.target);
}
});
},{threshold:.15});
els.forEach(function(el,i){
if(el.closest('.hero')) return;
el.classList.add('rv');
el.style.transitionDelay=(i%3)*70+'ms';
io.observe(el);
});
}
})();
</script>
</body>
</html>