Dark mode is not available.
MY TOOLS 0

My Tool Bucket

Your Bucket is Empty

No tools in your bucket yet. Start Browse to add some!

Browse All Tools
AI Page Builder - Orunk AI Page Builder -

Orunk AI Page Builder

Generate full landing pages with HTML and Tailwind CSS from a single prompt.

2. Live Preview

Your generated page will appear here.

The preview might take a moment to load after generation.

3. Generated Code

  
MY TOOLS 0

My Tool Bucket

Your Bucket is Empty

No tools in your bucket yet. Start Browse to add some!

Browse All Tools
. Use real, high-quality, and relevant image URLs from Pexels, Unsplash, or Pixabay where appropriate. The entire output must be only the raw HTML code, without any markdown formatting, backticks, or explanations." }, { "role": "user", "content": userPrompt } ], temperature: 0.7, max_tokens: 4096, }; try { const response = await fetch(API_URL, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${TOGETHER_API_KEY}` }, body: JSON.stringify(payload) }); if (!response.ok) { const errorData = await response.json(); throw new Error(errorData.error ? errorData.error.message : `HTTP error! Status: ${response.status}`); } const data = await response.json(); let generatedHtml = data.choices[0].message.content; generatedHtml = generatedHtml.replace(/```html/g, '').replace(/```/g, '').trim(); lastGeneratedCode = generatedHtml; previewPlaceholder.style.display = 'none'; previewIframe.srcdoc = lastGeneratedCode; previewIframe.style.opacity = '1'; htmlCodeEl.textContent = lastGeneratedCode; } catch (error) { console.error('Error generating page:', error); htmlCodeEl.textContent = `/* Error: ${error.message} */`; alert(`An error occurred: ${error.message}`); } finally { generateBtn.disabled = false; generateBtnText.textContent = 'Generate Page'; generateLoader.classList.add('hidden'); } } function copyHtmlToClipboard() { if (!lastGeneratedCode) { alert('Please generate a page first.'); return; } navigator.clipboard.writeText(lastGeneratedCode).then(() => { copyHtmlBtn.innerHTML = 'Copied!'; setTimeout(() => { copyHtmlBtn.innerHTML = 'Copy Code'; }, 2000); }).catch(err => { alert('Failed to copy code.'); console.error('Failed to copy code: ', err); }); } function exportToFile() { if (!lastGeneratedCode) { alert('Please generate a page first.'); return; } const blob = new Blob([lastGeneratedCode], { type: 'text/html' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'generated-page.html'; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } function toggleTheme() { themeWrapper.classList.toggle('dark', themeToggle.checked); } generateBtn.addEventListener('click', generatePage); copyHtmlBtn.addEventListener('click', copyHtmlToClipboard); exportBtn.addEventListener('click', exportToFile); themeToggle.addEventListener('change', toggleTheme); });