now make this the best code editor site but it will require money so their will be a credits system you will start with 100,000 credits and everytime you generate a project you will spend 20,000 credits meaning only 10 projects and then you gotta pay $10.90 for CA plus to generate more projects and make multiple pages like search engines and then make the login or resteragion actually work then make it the fastest and best site there is out there it will also be a manual code editor ai is optional but ai will cost you you use ai you will get only one project then have to pay money
3afcae2 verified | <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Pricing - CodeCraft AI</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| </head> | |
| <body class="bg-gray-100"> | |
| <header class="bg-gray-900 text-white p-4"> | |
| <div class="container mx-auto flex justify-between items-center"> | |
| <div class="flex items-center"> | |
| <i data-feather="code" class="mr-2"></i> | |
| <h1 class="text-xl font-bold">CodeCraft AI</h1> | |
| </div> | |
| <nav class="hidden md:flex space-x-6"> | |
| <a href="index.html" class="hover:text-purple-300">Home</a> | |
| <a href="editor.html" class="hover:text-purple-300">Editor</a> | |
| <a href="pricing.html" class="text-purple-300 font-bold">Pricing</a> | |
| </nav> | |
| </div> | |
| </header> | |
| <main class="container mx-auto py-12 px-4"> | |
| <div class="text-center mb-12"> | |
| <h1 class="text-4xl font-bold mb-4">Choose Your Plan</h1> | |
| <p class="text-xl text-gray-600 max-w-2xl mx-auto"> | |
| Get more credits and unlock powerful features with our premium plans | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-5xl mx-auto"> | |
| <!-- Free Plan --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="p-6 bg-gray-100"> | |
| <h2 class="text-2xl font-bold">Free</h2> | |
| <p class="text-gray-600">For beginners and testing</p> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold mb-4">$0<span class="text-lg text-gray-500">/forever</span></div> | |
| <ul class="space-y-3 mb-6"> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>100,000 starting credits</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Basic code editor</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="x" class="text-red-500 mr-2"></i> | |
| <span class="text-gray-400">No AI assistance</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="x" class="text-red-500 mr-2"></i> | |
| <span class="text-gray-400">No project saving</span> | |
| </li> | |
| </ul> | |
| <button class="w-full py-2 px-4 border border-gray-300 rounded-md text-gray-700 bg-white hover:bg-gray-50"> | |
| Current Plan | |
| </button> | |
| </div> | |
| </div> | |
| <!-- CA Plus --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden border-2 border-purple-500 transform scale-105"> | |
| <div class="p-6 gradient-bg text-white"> | |
| <h2 class="text-2xl font-bold">CA Plus</h2> | |
| <p>Most popular for professionals</p> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold mb-4">$10.90<span class="text-lg text-gray-500">/month</span></div> | |
| <ul class="space-y-3 mb-6"> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Unlimited credits</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Advanced code editor</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>AI code assistance</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Project saving & sharing</span> | |
| </li> | |
| </ul> | |
| <button class="w-full py-2 px-4 gradient-bg hover:opacity-90 rounded-md text-white font-bold"> | |
| Upgrade Now | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Team Plan --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="p-6 bg-gray-100"> | |
| <h2 class="text-2xl font-bold">Team</h2> | |
| <p class="text-gray-600">For development teams</p> | |
| </div> | |
| <div class="p-6"> | |
| <div class="text-4xl font-bold mb-4">$29<span class="text-lg text-gray-500">/month</span></div> | |
| <ul class="space-y-3 mb-6"> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Everything in CA Plus</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Up to 5 team members</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Collaborative coding</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i data-feather="check" class="text-green-500 mr-2"></i> | |
| <span>Priority support</span> | |
| </li> | |
| </ul> | |
| <button class="w-full py-2 px-4 border border-gray-300 rounded-md text-gray-700 bg-white hover:bg-gray-50"> | |
| Contact Sales | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mt-16 max-w-4xl mx-auto bg-white rounded-xl shadow-lg p-8"> | |
| <h2 class="text-2xl font-bold mb-4">Frequently Asked Questions</h2> | |
| <div class="space-y-4"> | |
| <div class="border-b pb-4"> | |
| <h3 class="font-bold mb-2">How does the credit system work?</h3> | |
| <p class="text-gray-600">Each code execution costs 20,000 credits. AI assistance costs 50,000 credits per request. Free accounts get 100,000 credits to start (5 executions or 2 AI requests).</p> | |
| </div> | |
| <div class="border-b pb-4"> | |
| <h3 class="font-bold mb-2">What payment methods do you accept?</h3> | |
| <p class="text-gray-600">We accept all major credit cards, PayPal, and cryptocurrency payments.</p> | |
| </div> | |
| <div class="border-b pb-4"> | |
| <h3 class="font-bold mb-2">Can I cancel anytime?</h3> | |
| <p class="text-gray-600">Yes, you can cancel your subscription anytime. You'll keep access until the end of your billing period.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <footer class="bg-gray-900 text-white py-8"> | |
| <div class="container mx-auto px-4 text-center"> | |
| <p>© 2023 CodeCraft AI. All rights reserved.</p> | |
| </div> | |
| </footer> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| </body> | |
| </html> |