Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Pointer - General Purpose AI Agent</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap'); | |
| body { | |
| font-family: 'Space Grotesk', sans-serif; | |
| background-color: #F9F9F9; | |
| } | |
| .neobrutal-border { | |
| border: 3px solid #000; | |
| box-shadow: 8px 8px 0px #000; | |
| } | |
| .neobrutal-border-thin { | |
| border: 2px solid #000; | |
| box-shadow: 4px 4px 0px #000; | |
| } | |
| .neobrutal-btn { | |
| transition: all 0.2s ease; | |
| } | |
| .neobrutal-btn:hover { | |
| transform: translate(2px, 2px); | |
| box-shadow: 2px 2px 0px #000; | |
| } | |
| .neobrutal-highlight { | |
| background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, #FFE500 50%, #FFE500 100%); | |
| background-size: 200% 100%; | |
| background-position: 100% 0; | |
| transition: background-position 0.3s ease; | |
| } | |
| .neobrutal-highlight:hover { | |
| background-position: 0 0; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-[#F9F9F9]"> | |
| <!-- Navigation --> | |
| <nav class="bg-white py-4 px-6 neobrutal-border sticky top-0 z-50"> | |
| <div class="container mx-auto flex justify-between items-center"> | |
| <div class="flex items-center space-x-2"> | |
| <div class="w-8 h-8 bg-black flex items-center justify-center neobrutal-border-thin"> | |
| <span class="text-white font-bold">P</span> | |
| </div> | |
| <span class="font-bold text-xl">Pointer</span> | |
| </div> | |
| <div class="hidden md:flex space-x-6"> | |
| <a href="#" class="font-medium hover:text-blue-600 neobrutal-highlight px-2 py-1">Company</a> | |
| <a href="#" class="font-medium hover:text-blue-600 neobrutal-highlight px-2 py-1">Docs</a> | |
| <a href="#" class="font-medium hover:text-blue-600 neobrutal-highlight px-2 py-1">Changelog</a> | |
| <a href="#" class="font-medium hover:text-blue-600 neobrutal-highlight px-2 py-1">Discord</a> | |
| <a href="#" class="font-medium hover:text-blue-600 neobrutal-highlight px-2 py-1">Contact</a> | |
| </div> | |
| <div class="flex items-center space-x-4"> | |
| <a href="#" class="hidden md:block font-medium px-4 py-2 bg-white neobrutal-border-thin hover:bg-gray-100 neobrutal-btn">Sign Up</a> | |
| <button class="md:hidden neobrutal-border-thin p-2"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <section class="py-16 px-6"> | |
| <div class="container mx-auto"> | |
| <div class="bg-white p-8 neobrutal-border max-w-4xl mx-auto"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-8 md:mb-0"> | |
| <h1 class="text-4xl md:text-5xl font-bold mb-4 leading-tight"> | |
| The Super intelligence <br> | |
| <span class="text-blue-600">for everyone</span> | |
| </h1> | |
| <p class="text-lg mb-6"> | |
| Pointer is the world's first General Purpose AI Agent that can browse the web, read documents, analyze data, write code, and perform tasks autonomously for you. | |
| </p> | |
| <div class="flex flex-col sm:flex-row space-y-3 sm:space-y-0 sm:space-x-4"> | |
| <a href="#" class="px-6 py-3 bg-black text-white font-bold text-center neobrutal-border-thin hover:bg-gray-800 neobrutal-btn"> | |
| Join Private Beta | |
| </a> | |
| <a href="#" class="px-6 py-3 bg-white font-bold text-center neobrutal-border-thin hover:bg-gray-100 neobrutal-btn"> | |
| Pointer CLI Waitlist | |
| </a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <div class="relative"> | |
| <div class="w-64 h-64 bg-blue-100 neobrutal-border flex items-center justify-center"> | |
| <div class="w-48 h-48 bg-blue-200 neobrutal-border-thin flex items-center justify-center"> | |
| <div class="w-32 h-32 bg-blue-300 neobrutal-border-thin flex items-center justify-center"> | |
| <i class="fas fa-robot text-4xl"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="absolute -bottom-4 -right-4 bg-yellow-300 px-4 py-2 neobrutal-border-thin font-bold"> | |
| Research Preview | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Features Section --> | |
| <section class="py-16 px-6 bg-white"> | |
| <div class="container mx-auto"> | |
| <div class="text-center mb-12"> | |
| <h2 class="text-3xl font-bold mb-4">General Purpose Agent</h2> | |
| <p class="text-xl">Handling tasks autonomously</p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <!-- Feature 1 --> | |
| <div class="bg-[#FFEEEE] p-6 neobrutal-border h-full"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 bg-red-500 text-white flex items-center justify-center neobrutal-border-thin mr-4"> | |
| <i class="fas fa-bolt text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold">Autonomous</h3> | |
| </div> | |
| <p>Takes initiative and completes tasks autonomously with human-in-the-loop.</p> | |
| </div> | |
| <!-- Feature 2 --> | |
| <div class="bg-[#EEFFEE] p-6 neobrutal-border h-full"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 bg-green-500 text-white flex items-center justify-center neobrutal-border-thin mr-4"> | |
| <i class="fas fa-globe text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold">Generalist</h3> | |
| </div> | |
| <p>Handles diverse and long-horizon tasks across multiple domains with instructions.</p> | |
| </div> | |
| <!-- Feature 3 --> | |
| <div class="bg-[#EEEEFF] p-6 neobrutal-border h-full"> | |
| <div class="flex items-center mb-4"> | |
| <div class="w-12 h-12 bg-blue-500 text-white flex items-center justify-center neobrutal-border-thin mr-4"> | |
| <i class="fas fa-brain text-xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold">Adaptive</h3> | |
| </div> | |
| <p>Improves over time based on feedback with human-like memory and reasoning.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Demo Section --> | |
| <section class="py-16 px-6"> | |
| <div class="container mx-auto"> | |
| <div class="bg-white p-8 neobrutal-border"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/2 mb-8 md:mb-0"> | |
| <h2 class="text-3xl font-bold mb-4">Experience the Future</h2> | |
| <h3 class="text-2xl text-blue-600 font-bold mb-4">General Purpose Assistant for everyone</h3> | |
| <p class="text-lg mb-6"> | |
| Watch as Pointer navigates the web, understands complex tasks, and executes them with human-like reasoning. From research to automation, it handles it all. | |
| </p> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="px-6 py-3 bg-black text-white font-bold neobrutal-border-thin hover:bg-gray-800 neobrutal-btn"> | |
| Start a Task | |
| </a> | |
| <a href="#" class="px-6 py-3 bg-white font-bold neobrutal-border-thin hover:bg-gray-100 neobrutal-btn"> | |
| View Progress | |
| </a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2"> | |
| <div class="bg-gray-200 p-4 neobrutal-border-thin"> | |
| <div class="bg-black text-white p-2 flex justify-between items-center"> | |
| <span class="font-mono">pointer-agent --task="research AI trends"</span> | |
| <div class="flex space-x-2"> | |
| <div class="w-3 h-3 bg-red-500 rounded-full"></div> | |
| <div class="w-3 h-3 bg-yellow-500 rounded-full"></div> | |
| <div class="w-3 h-3 bg-green-500 rounded-full"></div> | |
| </div> | |
| </div> | |
| <div class="bg-white p-4 h-64 overflow-y-auto font-mono text-sm"> | |
| <p class="text-green-600">> Initializing Pointer Agent v1.2.3</p> | |
| <p class="text-green-600">> Authenticating user session...</p> | |
| <p class="text-green-600">> Parsing task: "research AI trends"</p> | |
| <p class="text-blue-600">> Breaking down into subtasks:</p> | |
| <p class="text-blue-600">> 1. Identify key AI trends in 2023</p> | |
| <p class="text-blue-600">> 2. Gather data from reputable sources</p> | |
| <p class="text-blue-600">> 3. Analyze emerging patterns</p> | |
| <p class="text-blue-600">> 4. Compile comprehensive report</p> | |
| <p class="text-purple-600">> Starting subtask 1...</p> | |
| <p class="text-gray-600">> Opening browser to search for "top AI trends 2023"</p> | |
| <p class="text-gray-600">> Found 12 relevant articles from TechCrunch, MIT Review, etc.</p> | |
| <p class="text-purple-600">> Extracting key information...</p> | |
| <p class="animate-pulse">> _</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Open Source Section --> | |
| <section class="py-16 px-6 bg-black text-white"> | |
| <div class="container mx-auto text-center"> | |
| <div class="max-w-3xl mx-auto neobrutal-border p-8 bg-gray-900"> | |
| <div class="w-20 h-20 bg-yellow-400 text-black flex items-center justify-center neobrutal-border-thin mx-auto mb-6"> | |
| <i class="fab fa-github text-3xl"></i> | |
| </div> | |
| <h2 class="text-3xl font-bold mb-4">Pointer is committed to open source</h2> | |
| <p class="text-xl mb-6">with an official release coming soon</p> | |
| <a href="#" class="inline-block px-6 py-3 bg-yellow-400 text-black font-bold neobrutal-border-thin hover:bg-yellow-300 neobrutal-btn"> | |
| Star on GitHub | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CTA Section --> | |
| <section class="py-16 px-6"> | |
| <div class="container mx-auto"> | |
| <div class="bg-white p-8 neobrutal-border max-w-4xl mx-auto"> | |
| <div class="text-center"> | |
| <h2 class="text-3xl font-bold mb-4">Get Started with Pointer</h2> | |
| <p class="text-xl mb-8">Join the private beta today and be among the first to experience the future of agentic computing.</p> | |
| <a href="#" class="inline-block px-8 py-4 bg-blue-600 text-white font-bold text-lg neobrutal-border-thin hover:bg-blue-500 neobrutal-btn"> | |
| Join Private Beta | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="bg-white py-8 px-6 neobrutal-border-t"> | |
| <div class="container mx-auto"> | |
| <div class="flex flex-col md:flex-row justify-between items-center"> | |
| <div class="flex items-center space-x-2 mb-4 md:mb-0"> | |
| <div class="w-8 h-8 bg-black flex items-center justify-center neobrutal-border-thin"> | |
| <span class="text-white font-bold">P</span> | |
| </div> | |
| <span class="font-bold">Pointer</span> | |
| </div> | |
| <div class="flex space-x-6 mb-4 md:mb-0"> | |
| <a href="#" class="hover:text-blue-600"><i class="fab fa-twitter text-xl"></i></a> | |
| <a href="#" class="hover:text-blue-600"><i class="fab fa-github text-xl"></i></a> | |
| <a href="#" class="hover:text-blue-600"><i class="fab fa-discord text-xl"></i></a> | |
| <a href="#" class="hover:text-blue-600"><i class="fab fa-linkedin text-xl"></i></a> | |
| </div> | |
| <div class="text-sm"> | |
| © 2025 Pointer. All rights reserved. | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Floating Pointer --> | |
| <div class="fixed bottom-8 right-8 w-16 h-16 bg-yellow-400 neobrutal-border-thin rounded-full flex items-center justify-center cursor-pointer hover:bg-yellow-300 neobrutal-btn"> | |
| <i class="fas fa-robot text-2xl"></i> | |
| </div> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=imjliao/pointer-page" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |