Component Wizard v1

Write your component requirements, and I'll give you the code.

Currently HTML and TailwindCSS code is generated.

Created by Berkay

Recent generations
"Form email template with title: '', headerText: '', footerText: '', type: "", otherType: '', sendDate: new Date(),"
<div class="bg-white p-6 rounded-lg shadow-md">
    <h1 class="text-2xl font-bold mb-4"></h1>
    <p class="text-gray-700 mb-6"></p>
    <footer class="mt-6">
        <p class="text-gray-600 text-sm"></p>
        <p class="text-gray-600 text-sm">Sent on: <span id="sendDate"></span></p>
    </footer>
</div>
"dsdsd"
<div class="flex items-center justify-center h-screen bg-gray-100">
    <div class="bg-white shadow-md rounded-lg p-6 max-w-md">
        <h2 class="text-2xl font-bold text-gray-800 text-center">Welcome</h2>
        <p class="mt-4 text-gray-600 text-center">This is a default structure. Please provide specific requirements for your component.</p>
    </div>
</div>
"dashboard"
<div class="min-h-screen bg-gray-100 flex flex-col">
    <header class="bg-white shadow">
        <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
            <h1 class="text-3xl font-bold text-gray-900">Dashboard</h1>
        </div>
    </header>
    <main class="flex-grow">
        <div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                <div class="bg-white overflow-hidden shadow rounded-lg">
                    <div class="p-6">
                        <h2 class="font-bold text-xl text-gray-800">Card Title 1</h2>
                        <p class="mt-2 text-gray-600">Some descriptive text related to Card Title 1.</p>
                    </div>
                </div>
                <div class="bg-white overflow-hidden shadow rounded-lg">
                    <div class="p-6">
                        <h2 class="font-bold text-xl text-gray-800">Card Title 2</h2>
                        <p class="mt-2 text-gray-600">Some descriptive text related to Card Title 2.</p>
                    </div>
                </div>
                <div class="bg-white overflow-hidden shadow rounded-lg">
                    <div class="p-6">
                        <h2 class="font-bold text-xl text-gray-800">Card Title 3</h2>
                        <p class="mt-2 text-gray-600">Some descriptive text related to Card Title 3.</p>
                    </div>
                </div>
            </div>
        </div>
    </main>
</div>