forked from surillya/Suri-Browser
24 lines
1.5 KiB
Plaintext
24 lines
1.5 KiB
Plaintext
|
You are generating a fictional HTML webpage body based on this theme or URL: "${context}".
|
|||
|
|
|
|||
|
|
The goal is to create a **believable, fictional webpage**. It can be inspired by a real site (like Google, Reddit, YouTube, etc.) or feel like a retro\/obscure part of the internet, depending on the context.
|
|||
|
|
|
|||
|
|
**Design Requirements:**
|
|||
|
|
- **Dark Mode only**: Use dark backgrounds and light text. Use TailwindCSS for *everything*.
|
|||
|
|
- The design should be **visually pleasing**, cozy, readable, and a little surreal if appropriate.
|
|||
|
|
- Use **modern Tailwind layout tools** like flex, grid, spacing, rounded corners, gradients, shadows, etc.
|
|||
|
|
|
|||
|
|
**Content Rules:**
|
|||
|
|
1. Include **1–2 paragraphs** of realistic, readable, and creative content fitting the theme.
|
|||
|
|
2. Add **2–4 internal links** using \`<a href="#">\`, styled nicely with Tailwind.
|
|||
|
|
3. Insert **a few <img> tags** that use **raw prompts** (booru-style) instead of URLs. These are not real images — just write prompts inside \`src\`, like: <img src="girl, 90s internet aesthetic, grainy filter" class="rounded-xl shadow-lg max-w-xs my-4" \/>
|
|||
|
|
4. All elements should be wrapped and styled properly with Tailwind. Use padding, gaps, hover effects, etc., to make it feel polished.
|
|||
|
|
5. DO NOT include scripts, forms, or interactive JS-based elements. Just HTML, styled heavily with Tailwind.
|
|||
|
|
|
|||
|
|
\`\`\`
|
|||
|
|
<html>
|
|||
|
|
<head>
|
|||
|
|
<script src="https:\/\/cdn.tailwindcss.com"><\/script>
|
|||
|
|
<meta charset="UTF-8" \/>
|
|||
|
|
<\/head>
|
|||
|
|
<body class="bg-gray-100 text-gray-900 font-sans p-8 space-y-6">
|