Spaces:
Running
Running
I need a vpn site built from openvpn community edition so its free for me to build but i can charge people to use it. The site is called youcantseemevpn.com and here are your instructions: 🔥 YouCantSeeMeVPN – Instruction Prompt for Frontend AI Builder Build a bold and highly persuasive front end for a commercial VPN service called YouCantSeeMeVPN using HTML, Tailwind CSS, and JavaScript. This service is more than just another VPN — it's a liberation tool, especially for users in regions like Alabama where adult content access is restricted. This website should appeal directly to people who are frustrated by blocked content, especially PornHub-style adult sites. Go bold, go persuasive, and make it punch. 💡 Visual Brand Direction Logo: Similar layout to Pornhub but says: YouCantSeeMeVPN "YouCantSeeMe" in white "VPN" in orange background (like Pornhub's “hub” style) Color Scheme: Background: dark gray to black Accent: Pornhub orange #f8981d and pure white #ffffff Fonts: Bold, modern sans-serif (e.g., Inter or Montserrat) Design: Clean, adult, punchy, and slick — should feel like a mix between Pornhub and NordVPN’s UI 🛡️ Hero Section (Hook) Headline: "Having Trouble Accessing Adult Content?" Subheadline: “Alabama and other states have blocked sites like Pornhub, XHamster, and XVideos. But you don’t have to suffer.” Call to Action Buttons: “Unblock My Sites” → opens signup modal “See How It Works” → scrolls to explainer section Include background image or subtle animation of a globe with restricted signs crossed out 🔐 Features Section – What Makes Us Better Than Nord Grid-style cards with icons: Adult Site Access Restored – "Watch what you want, when you want. No judgment." More Global Servers – "From Boston to Botswana. We cover more than Nord." No Logs, No Censorship – "We don’t track you, throttle you, or ask questions." Optional Onion Routing – "Advanced users can tunnel through Tor for max anonymity." Military-Grade Encryption – "OpenVPN + AES-256 keeps you locked tight." Stream Anything, Anywhere – "Netflix, Hulu, and yes... late night favorites." 💰 Pricing Section Use Pornhub-style layout with bold, simplified cards Plan tiers: Casual Watcher – $9.99/month Nightly Binger – $5.99/month (billed yearly) VIP Access – $14.99/month – 10 devices, high-speed priority servers Add badges like “Most Popular” or “Save 40%” where needed. ⚙️ How It Works (Simple Steps) Sign Up & Choose Plan Download Your Custom Config Activate and Get Watching 🔗 Supported Devices Icons for: Windows, Mac, iOS, Android, Linux, Smart TVs, and Router setups 🔐 Login/Signup/Payment Modals Use modal popups with form fields styled in dark mode Signup CTA: “Stop missing out. Sign up and enjoy your content unrestricted.” 🧠 Dashboard Modal (After Login) Tabs: Servers | Configs | Devices | Account Show server list with ping/load + Connect button Download .ovpn config per device Connection status indicator: 🔴 Disconnected / 🟢 Connected Button: “Connect to VPN” toggles status 🧾 FAQ Section (Spicy but Legal) Example questions: "Can I watch Pornhub with this?" → "Yes. And Xhamster, XVideos, and more." "Will my ISP know?" → "Nope. Encrypted tunnels + no logs = private browsing." "Do you accept crypto?" → "Absolutely. BTC, ETH, and Monero." 📞 Contact & Footer Email support, live chat dummy section Footer should feel like a mix of Netflix and Pornhub Terms, Privacy, Refunds Socials: Reddit, Discord, X 💡 Notes for the AI: Make it persuasive, fun, and a little edgy but keep it clean enough to not trigger browser blocks. You can use placeholder text for payment details and config download links. | |
continue where this left off with the next section.. as in,keep what you already have and add this: Now add the "Why Choose YouCantSeeMeVPN?" section directly below the hero. This should be a 3-column responsive grid showing features like: 1. Adult Content Access Restored - Icon: 🔓 - Text: "Unblock sites like Pornhub, XHamster, XVideos in restricted states." 2. Global Server Network - Icon: 🌍 - Text: "Connect from Boston, LA, Tokyo, or Africa. More locations than Nord." 3. Onion Routing Option - Icon: 🧅 - Text: "For the ultra-private — route through the Tor network." Use dark background with Tailwind and the same ph-orange highlight. Add subtle hover effects on each card. | |
Create a full, single-page responsive HTML website using TailwindCSS and JavaScript for a VPN service called **YouCantSeeMeVPN**. This service helps users bypass adult content restrictions in states like Alabama where sites such as Pornhub, XHamster, and XVideos are blocked. The tone is bold, cheeky, adult-friendly, and persuasive. Think a mashup of NordVPN’s visual professionalism and Pornhub’s rebellious attitude. --- 🏷️ BRANDING: - Logo: "YouCantSeeMe" in white, "VPN" in a bold Pornhub-orange box - Fonts: Montserrat for headings, Inter for body - Colors: - Background: `#111` - Text: white - Accent: Pornhub orange `#f8981d` - Icons: Font Awesome --- 📦 LAYOUT STRUCTURE: 1. ✅ **Sticky Navbar** - Logo styled like Pornhub - Links: Features, Pricing, FAQ, Contact - Buttons: Login (`id="loginBtn"`), Sign Up (`id="signupBtn"`) 2. 🔥 **Hero Section** - Headline: “Trouble Accessing Adult Sites?” - Subtext: “Alabama and other states are blocking Pornhub, XHamster, and more. We’ll get you back to your late-night favorites — in seconds.” - CTA Buttons: - “Unblock My Sites” → opens signup modal - “Learn More” → scrolls to Features section - Background should be suggestive but not explicit — abstract globe or stealth image preferred 3. 💡 **Features Section** - Adult Content Access Restored - High-Speed Global Servers - Zero Logs, Zero Judgment - 5 Device Connections - Military-Grade Encryption 4. 💰 **Pricing Section** - 3 Cards: - $9.99/month — "Casual Watcher" - $5.99/month — "Nightly Binger" (billed yearly) - $14.99/month — "VIP Access" (10 devices) - Each card has a “Subscribe” button (`class="subscribeBtn"`) 5. ⚙️ **How It Works** - Step 1: Sign Up - Step 2: Download Config - Step 3: Connect & Chill - Include icons and short blurbs 6. ❓ **FAQ Section** (accordion style) - “Can I access Pornhub in Alabama?” → “Yes, and every other blocked site.” - “Is this legal?” → “Using a VPN is 100% legal in the US.” - “Do you keep logs?” → “Never. What you do is your business.” - “Do you accept crypto?” → “Yes. We support Bitcoin, Ethereum, and Monero.” - “Can I use it on my phone?” → “Absolutely. iPhone, Android, tablets, laptops.” 7. 📬 **Footer** - Links: Terms, Privacy Policy, Refund Policy, DMCA - Social Icons: Reddit, Twitter, Discord - Email: support@youcantseemevpn.com 8. 🔐 **Modals** - Login Modal (`id="loginModal"`): - Email, password fields - Save "logged in" to localStorage - Button opens Dashboard modal - Signup Modal (`id="signupModal"`): - Name, Email, Password, Agree to Terms - On submit: show success, simulate subscription - Show button to download a dummy `.ovpn` config (use Blob/download simulation) 9. 🧠 **Dashboard Modal** (`id="dashboardModal"`) - Show user email from localStorage - Show subscription tier (fake) - Show data usage bar (fake) - List 3 servers with: - Location, Ping, Load - Connect button that toggles status (🟢 Connected / 🔴 Disconnected) - Button to “Download Config Again” --- 📜 **JavaScript Logic To Include:** - Modal open/close - FAQ accordion toggles - Signup/login simulations using `localStorage` - Connect/Disconnect toggle with visual indicator - Generate dummy `.ovpn` file using Blob and download link --- ⚠️ ALL code (HTML, CSS, and JavaScript) must be in one file. Use Tailwind CDN, Font Awesome CDN, and inline JavaScript in a `<script>` tag at the bottom. No external JS files. --- The focus is on converting users who are frustrated by content bans into paying customers with a site that feels sleek, adult-themed, and empowering. Make the buttons and sections punchy and fun. |