What do you want to build?
Content: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Antoine's Bio | UC Berkeley AI Research</title> <meta name="description" content="Learn about Antoine, a researcher from France at UC Berkeley, specializing in AI and its applications."> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&family=Sacramento&display=swap" rel="stylesheet" /> </head> <body class="bg-gradient-to-br from-gray-100 to-gray-200 font-sans"> <header class="bg-white shadow-md"> <nav class="container mx-auto px-4 py-4"> <div class="flex justify-between items-center"> <div class="text-xl font-bold text-gray-800 text-Sacramento">Antoine's Bio</div> <div> <a href="#about" class="text-gray-700 hover:text-blue-600 mx-2">About</a> <a href="#research" class="text-gray-700 hover:text-blue-600 mx-2">Research</a> <a href="#contact" class="text-gray-700 hover:text-blue-600 mx-2">Contact</a> </div> </div> </nav> </header> <main class="container mx-auto mt-10 px-4"> <section id="about" class="mb-12 text-center"> <h1 class="mb-4 text-5xl font-extrabold text-gray-900">Meet Antoine</h1> <img src="https://service-jobs-images.s3.us-east-2.amazonaws.com/vxq460gvzb1z9fhqk1rasy0utr9t" alt="Antoine's Profile" class="w-48 h-48 mx-auto rounded-full shadow-lg" /> <p class="mt-4 text-lg text-gray-700">A passionate AI researcher from France, currently exploring innovative solutions at UC Berkeley.</p> </section> <section id="research" class="mb-12"> <h2 class="mb-6 text-3xl font-bold text-gray-800 text-center">Research Interests</h2> <div class="grid grid-cols-1 md:grid-cols-3 gap-6"> <div class="bg-white p-6 rounded-lg shadow-lg hover:shadow-xl transition-shadow duration-300"> <h3 class="text-xl font-semibold text-gray-800">AI and Machine Learning</h3> <p class="text-gray-600">Investigating the latest algorithms and their real-world applications.</p> </div> <div class="bg-white p-6 rounded-lg shadow-lg hover:shadow-xl transition-shadow duration-300"> <h3 class="text-xl font-semibold text-gray-800">Natural Language Processing</h3> <p class="text-gray-600">Working on AI systems that understand and generate human language.</p> </div> <div class="bg-white p-6 rounded-lg shadow-lg hover:shadow-xl transition-shadow duration-300"> <h3 class="text-xl font-semibold text-gray-800">Computer Vision</h3> <p class="text-gray-600">Enhancing machine perception of images and videos.</p> </div> </div> </section> <section id="contact" class="text-center"> <h2 class="mb-6 text-3xl font-bold text-gray-800">Get in Touch</h2> <p class="text-lg text-gray-700">Feel free to reach out for collaborations or inquiries!</p> <a href="mailto:antoine@example.com" class="mt-4 inline-block bg-blue-500 text-white px-6 py-3 rounded-lg hover:bg-blue-600 transition duration-300">Contact Me</a> </section> </main> <footer class="bg-gray-800 py-6 text-white mt-12"> <div class="container mx-auto text-center"> <p>© 2024 Antoine. All rights reserved.</p> <div class="mt-4"> <a href="#" class="hover:text-blue-400">Privacy Policy</a> <span class="mx-2">|</span> <a href="#" class="hover:text-blue-400">Terms of Service</a> <span class="mx-2">|</span> <a href="#" class="hover:text-blue-400">Follow Me</a> </div> </div> </footer> </body> </html>
Web page: 2
What do you want to build?
