Personal Portfolio — Preview

source.html

<html lang="en" style="--color-primary: #06B6D4; --color-secondary: #0891B2; --color-bg: #F0FDFF; --color-text: #164E63;"><head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Alex Rivera - Product Designer Portfolio</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600;700&amp;family=Roboto:wght@300;400;500;700&amp;display=swap" rel="stylesheet">
    <style>
        :root {
            --color-primary: #938e85;
            --color-secondary: #44ff00;
            --color-bg: #FFFBEB;
            --color-text: #1E293B;
        }
        
        * {
            font-family: 'Roboto', sans-serif;
        }
        
        h1, h2, h3, h4, h5, h6 {
            font-family: 'IBM Plex Mono', monospace;
        }
        
        body {
            background-color: #0f172a;
            color: #e2e8f0;
        }
        
        .gradient-mesh {
            position: relative;
            overflow: hidden;
        }
        
        .gradient-mesh::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -20%;
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(244, 158, 11, 0.3) 0%, transparent 70%);
            animation:...

Buka full source code

Copy & download HTML + Tailwind siap pakai. Atau bikin versimu sendiri dari nol — lebih cepat.

✨ Remix gratis (2 credit) Daftar untuk copy code →