Spaces:
Running
Running
Make It a little less Bright. - Follow Up Deployment
Browse files- index.html +25 -25
- prompts.txt +2 -1
index.html
CHANGED
|
@@ -21,7 +21,7 @@
|
|
| 21 |
width: 20px;
|
| 22 |
height: 20px;
|
| 23 |
border-radius: 50%;
|
| 24 |
-
background: rgba(
|
| 25 |
transform: translate(-50%, -50%);
|
| 26 |
pointer-events: none;
|
| 27 |
z-index: 9999;
|
|
@@ -33,7 +33,7 @@
|
|
| 33 |
width: 6px;
|
| 34 |
height: 6px;
|
| 35 |
border-radius: 50%;
|
| 36 |
-
background: rgba(
|
| 37 |
transform: translate(-50%, -50%);
|
| 38 |
pointer-events: none;
|
| 39 |
z-index: 9998;
|
|
@@ -46,7 +46,7 @@
|
|
| 46 |
left: -10%;
|
| 47 |
width: 120%;
|
| 48 |
height: 120%;
|
| 49 |
-
background: linear-gradient(135deg, #
|
| 50 |
transition: transform 0.3s ease-out;
|
| 51 |
transform-origin: center;
|
| 52 |
z-index: -1;
|
|
@@ -74,18 +74,18 @@
|
|
| 74 |
<nav class="fixed w-full z-50 glass-effect py-4 px-6">
|
| 75 |
<div class="container mx-auto flex justify-between items-center">
|
| 76 |
<div class="flex items-center space-x-2">
|
| 77 |
-
<i data-feather="cpu" class="text-purple-
|
| 78 |
-
<span class="text-xl font-bold bg-gradient-to-r from-purple-
|
| 79 |
</div>
|
| 80 |
|
| 81 |
<div class="hidden md:flex space-x-8">
|
| 82 |
-
<a href="#solutions" class="hover:text-purple-
|
| 83 |
-
<a href="#features" class="hover:text-purple-
|
| 84 |
-
<a href="#pricing" class="hover:text-purple-
|
| 85 |
-
<a href="#contact" class="hover:text-purple-
|
| 86 |
</div>
|
| 87 |
|
| 88 |
-
<button class="bg-gradient-to-r from-purple-
|
| 89 |
Get Started
|
| 90 |
</button>
|
| 91 |
</div>
|
|
@@ -95,14 +95,14 @@
|
|
| 95 |
<!-- Hero Section -->
|
| 96 |
<section class="min-h-screen flex items-center justify-center px-6 pt-20">
|
| 97 |
<div class="container mx-auto text-center" data-aos="fade-up">
|
| 98 |
-
<h1 class="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-white to-purple-
|
| 99 |
Transform Your Digital Experience
|
| 100 |
</h1>
|
| 101 |
-
<p class="text-xl md:text-2xl text-purple-
|
| 102 |
Cutting-edge technology solutions that elevate your business to new heights with AI-powered innovation and seamless integration.
|
| 103 |
</p>
|
| 104 |
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
| 105 |
-
<button class="bg-gradient-to-r from-purple-
|
| 106 |
Start Free Trial
|
| 107 |
</button>
|
| 108 |
<button class="glass-effect text-white px-8 py-4 rounded-full text-lg font-semibold hover:bg-white hover:bg-opacity-20 transition-all hover-scale">
|
|
@@ -119,19 +119,19 @@
|
|
| 119 |
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16" data-aos="fade-up">Powerful Features</h2>
|
| 120 |
<div class="grid md:grid-cols-3 gap-8">
|
| 121 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="100">
|
| 122 |
-
<i data-feather="zap" class="text-4xl text-purple-
|
| 123 |
<h3 class="text-xl font-semibold mb-4">Lightning Fast</h3>
|
| 124 |
-
<p class="text-purple-
|
| 125 |
</div>
|
| 126 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="200">
|
| 127 |
-
<i data-feather="shield" class="text-4xl text-purple-
|
| 128 |
<h3 class="text-xl font-semibold mb-4">Enterprise Security</h3>
|
| 129 |
-
<p class="text-purple-
|
| 130 |
</div>
|
| 131 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="300">
|
| 132 |
-
<i data-feather="trending-up" class="text-4xl text-purple-
|
| 133 |
<h3 class="text-xl font-semibold mb-4">AI Powered</h3>
|
| 134 |
-
<p class="text-purple-
|
| 135 |
</div>
|
| 136 |
</div>
|
| 137 |
</div>
|
|
@@ -141,10 +141,10 @@
|
|
| 141 |
<section class="py-20 px-6">
|
| 142 |
<div class="container mx-auto text-center glass-effect rounded-3xl p-12" data-aos="zoom-in">
|
| 143 |
<h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Transform Your Business?</h2>
|
| 144 |
-
<p class="text-xl text-purple-
|
| 145 |
Join thousands of companies that trust our technology solutions to drive their success.
|
| 146 |
</p>
|
| 147 |
-
<button class="bg-gradient-to-r from-purple-
|
| 148 |
Get Started Now
|
| 149 |
</button>
|
| 150 |
</div>
|
|
@@ -154,11 +154,11 @@
|
|
| 154 |
<footer class="glass-effect py-12 px-6 mt-20">
|
| 155 |
<div class="container mx-auto text-center">
|
| 156 |
<div class="flex justify-center space-x-6 mb-8">
|
| 157 |
-
<a href="#" class="text-purple-
|
| 158 |
-
<a href="#" class="text-purple-
|
| 159 |
-
<a href="#" class="text-purple-
|
| 160 |
</div>
|
| 161 |
-
<p class="text-purple-
|
| 162 |
</div>
|
| 163 |
</footer>
|
| 164 |
|
|
|
|
| 21 |
width: 20px;
|
| 22 |
height: 20px;
|
| 23 |
border-radius: 50%;
|
| 24 |
+
background: rgba(124, 58, 237, 0.4);
|
| 25 |
transform: translate(-50%, -50%);
|
| 26 |
pointer-events: none;
|
| 27 |
z-index: 9999;
|
|
|
|
| 33 |
width: 6px;
|
| 34 |
height: 6px;
|
| 35 |
border-radius: 50%;
|
| 36 |
+
background: rgba(91, 33, 182, 0.25);
|
| 37 |
transform: translate(-50%, -50%);
|
| 38 |
pointer-events: none;
|
| 39 |
z-index: 9998;
|
|
|
|
| 46 |
left: -10%;
|
| 47 |
width: 120%;
|
| 48 |
height: 120%;
|
| 49 |
+
background: linear-gradient(135deg, #3b0764 0%, #5b21b6 25%, #7c3aed 50%, #8b5cf6 75%, #a78bfa 100%);
|
| 50 |
transition: transform 0.3s ease-out;
|
| 51 |
transform-origin: center;
|
| 52 |
z-index: -1;
|
|
|
|
| 74 |
<nav class="fixed w-full z-50 glass-effect py-4 px-6">
|
| 75 |
<div class="container mx-auto flex justify-between items-center">
|
| 76 |
<div class="flex items-center space-x-2">
|
| 77 |
+
<i data-feather="cpu" class="text-purple-200"></i>
|
| 78 |
+
<span class="text-xl font-bold bg-gradient-to-r from-purple-200 to-purple-100 bg-clip-text text-transparent">TechVision</span>
|
| 79 |
</div>
|
| 80 |
|
| 81 |
<div class="hidden md:flex space-x-8">
|
| 82 |
+
<a href="#solutions" class="hover:text-purple-200 transition-colors">Solutions</a>
|
| 83 |
+
<a href="#features" class="hover:text-purple-200 transition-colors">Features</a>
|
| 84 |
+
<a href="#pricing" class="hover:text-purple-200 transition-colors">Pricing</a>
|
| 85 |
+
<a href="#contact" class="hover:text-purple-200 transition-colors">Contact</a>
|
| 86 |
</div>
|
| 87 |
|
| 88 |
+
<button class="bg-gradient-to-r from-purple-700 to-purple-500 text-white px-6 py-2 rounded-full hover:from-purple-800 hover:to-purple-600 transition-all">
|
| 89 |
Get Started
|
| 90 |
</button>
|
| 91 |
</div>
|
|
|
|
| 95 |
<!-- Hero Section -->
|
| 96 |
<section class="min-h-screen flex items-center justify-center px-6 pt-20">
|
| 97 |
<div class="container mx-auto text-center" data-aos="fade-up">
|
| 98 |
+
<h1 class="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-white to-purple-100 bg-clip-text text-transparent">
|
| 99 |
Transform Your Digital Experience
|
| 100 |
</h1>
|
| 101 |
+
<p class="text-xl md:text-2xl text-purple-50 mb-8 max-w-3xl mx-auto">
|
| 102 |
Cutting-edge technology solutions that elevate your business to new heights with AI-powered innovation and seamless integration.
|
| 103 |
</p>
|
| 104 |
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
| 105 |
+
<button class="bg-gradient-to-r from-purple-700 to-purple-500 text-white px-8 py-4 rounded-full text-lg font-semibold hover:from-purple-800 hover:to-purple-600 transition-all hover-scale">
|
| 106 |
Start Free Trial
|
| 107 |
</button>
|
| 108 |
<button class="glass-effect text-white px-8 py-4 rounded-full text-lg font-semibold hover:bg-white hover:bg-opacity-20 transition-all hover-scale">
|
|
|
|
| 119 |
<h2 class="text-3xl md:text-4xl font-bold text-center mb-16" data-aos="fade-up">Powerful Features</h2>
|
| 120 |
<div class="grid md:grid-cols-3 gap-8">
|
| 121 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="100">
|
| 122 |
+
<i data-feather="zap" class="text-4xl text-purple-200 mb-4"></i>
|
| 123 |
<h3 class="text-xl font-semibold mb-4">Lightning Fast</h3>
|
| 124 |
+
<p class="text-purple-50">Optimized performance with instant load times and seamless user experiences.</p>
|
| 125 |
</div>
|
| 126 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="200">
|
| 127 |
+
<i data-feather="shield" class="text-4xl text-purple-200 mb-4"></i>
|
| 128 |
<h3 class="text-xl font-semibold mb-4">Enterprise Security</h3>
|
| 129 |
+
<p class="text-purple-50">Military-grade encryption and advanced security protocols to protect your data.</p>
|
| 130 |
</div>
|
| 131 |
<div class="glass-effect p-8 rounded-2xl hover-scale" data-aos="fade-up" data-aos-delay="300">
|
| 132 |
+
<i data-feather="trending-up" class="text-4xl text-purple-200 mb-4"></i>
|
| 133 |
<h3 class="text-xl font-semibold mb-4">AI Powered</h3>
|
| 134 |
+
<p class="text-purple-50">Intelligent automation and predictive analytics to drive your business growth.</p>
|
| 135 |
</div>
|
| 136 |
</div>
|
| 137 |
</div>
|
|
|
|
| 141 |
<section class="py-20 px-6">
|
| 142 |
<div class="container mx-auto text-center glass-effect rounded-3xl p-12" data-aos="zoom-in">
|
| 143 |
<h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Transform Your Business?</h2>
|
| 144 |
+
<p class="text-xl text-purple-50 mb-8 max-w-2xl mx-auto">
|
| 145 |
Join thousands of companies that trust our technology solutions to drive their success.
|
| 146 |
</p>
|
| 147 |
+
<button class="bg-gradient-to-r from-purple-700 to-purple-500 text-white px-12 py-4 rounded-full text-lg font-semibold hover:from-purple-800 hover:to-purple-600 transition-all hover-scale">
|
| 148 |
Get Started Now
|
| 149 |
</button>
|
| 150 |
</div>
|
|
|
|
| 154 |
<footer class="glass-effect py-12 px-6 mt-20">
|
| 155 |
<div class="container mx-auto text-center">
|
| 156 |
<div class="flex justify-center space-x-6 mb-8">
|
| 157 |
+
<a href="#" class="text-purple-100 hover:text-white transition-colors"><i data-feather="twitter"></i></a>
|
| 158 |
+
<a href="#" class="text-purple-100 hover:text-white transition-colors"><i data-feather="linkedin"></i></a>
|
| 159 |
+
<a href="#" class="text-purple-100 hover:text-white transition-colors"><i data-feather="github"></i></a>
|
| 160 |
</div>
|
| 161 |
+
<p class="text-purple-100">© 2024 TechVision. All rights reserved.</p>
|
| 162 |
</div>
|
| 163 |
</footer>
|
| 164 |
|
prompts.txt
CHANGED
|
@@ -1 +1,2 @@
|
|
| 1 |
-
Create a modern technology like website with a fancy purpleish dark purple gradient, abd a little bit of animation of the background. The effect with follows the cursor, but Just a little bit as if there were a 10% smaller background that tilted around the cursor. But Just a little bit. With smoothness. A beatiful gradient. Add more features with an easy to na igste and direct to action website
|
|
|
|
|
|
| 1 |
+
Create a modern technology like website with a fancy purpleish dark purple gradient, abd a little bit of animation of the background. The effect with follows the cursor, but Just a little bit as if there were a 10% smaller background that tilted around the cursor. But Just a little bit. With smoothness. A beatiful gradient. Add more features with an easy to na igste and direct to action website
|
| 2 |
+
Make It a little less Bright.
|