🔒

Enter Code SPUNK to Unlock

This exclusive premium tool requires the SPUNK referral code.

Get the code at spunk.codes/exclusive-tools

👑 EXCLUSIVE TOOL

Component Library Generator

Select components, choose a style, customize colors and spacing. Live preview and export as CSS + HTML snippets.

📦 Select Components

🎨 Choose Style

⚙ Customize

Primary Color

Border Radius8px

Font

Spacing

👀 Live Preview

💾 Export Code

Generate a preview first.

SPUNK.CODES EXCLUSIVE

\n'; document.getElementById('codeOutput').innerHTML=''+escapeHtml(output); } function copyCode(){ var text=document.getElementById('codeOutput').textContent; navigator.clipboard.writeText(text).then(function(){alert('Copied!')}); } function downloadCode(){ var text=document.getElementById('codeOutput').textContent; var ext=currentCodeView==='css'?'css':currentCodeView==='html'?'html':'html'; var blob=new Blob([text],{type:'text/'+ext}); var a=document.createElement('a');a.href=URL.createObjectURL(blob);a.download='components.'+ext;a.click(); } function escapeHtml(s){return s.replace(/&/g,'&').replace(//g,'>')} loadState(); renderCompGrid(); renderStyleGrid(); generatePreview(); function shareX(){window.open('https://twitter.com/intent/tweet?text='+encodeURIComponent('Building a component library with this generator. Code SPUNK unlocks it @SpunkArt13')+'&url='+encodeURIComponent('https://spunk.codes/exclusive-tools'),'_blank')} function shareReddit(){window.open('https://www.reddit.com/submit?url='+encodeURIComponent('https://spunk.codes/exclusive-tools')+'&title='+encodeURIComponent('Component Library Generator - free with code SPUNK [spunk.codes]'),'_blank')} function shareEmail(){window.location.href='mailto:?subject='+encodeURIComponent('Component Library Generator')+'&body='+encodeURIComponent('Generate component libraries with live preview. Code SPUNK: https://spunk.codes/exclusive-tools')}