Playfulsystem

Psychedelic 60s

82
🔥 Certified BangerThis prompt produces genuinely distinct output

Generates UI dripping with 1960s psychedelic poster energy — swirling color combos, organic curves, high-contrast complementary palettes, op-art patterns, and the mind-expanding visuals of the Summer of Love.

psychedelic60sswirlingop artgroovy

Added February 16, 2026 by unslop.dev

Example output

Groovy event card

Far Out Events Presents

Electric Dreamscape Festival

Three days of music, art, and cosmic consciousness. Bring your mind — we'll expand it.

View code
<div style="padding: 2rem; background: #1a0030;">
  <div style="max-width: 24rem; background: #FF6B00; border: 4px solid #AAFF00; border-radius: 24px; padding: 0; overflow: hidden;">
    <div style="background: #8B00FF; padding: 1rem 1.5rem; border-bottom: 4px solid #AAFF00;">
      <p style="font-family: Impact, 'Arial Black', sans-serif; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.2em; color: #AAFF00; margin: 0;">Far Out Events Presents</p>
    </div>
    <div style="padding: 1.5rem;">
      <h3 style="font-family: Palatino, Georgia, serif; font-size: 2rem; font-weight: 900; color: #1a0030; margin: 0 0 0.5rem 0; line-height: 1;">Electric Dreamscape Festival</h3>
      <p style="font-family: Palatino, Georgia, serif; font-size: 0.875rem; color: #4a0020; line-height: 1.5; margin: 0 0 1.25rem 0;">Three days of music, art, and cosmic consciousness. Bring your mind — we'll expand it.</p>
      <div style="display: flex; gap: 0.5rem;">
        <button style="background: #8B00FF; color: #AAFF00; border: 3px solid #1a0030; border-radius: 9999px; padding: 0.5rem 1.5rem; font-family: Impact, 'Arial Black', sans-serif; font-size: 0.8125rem; text-transform: uppercase; cursor: pointer; font-weight: 700;">Get Tickets</button>
        <button style="background: #AAFF00; color: #1a0030; border: 3px solid #1a0030; border-radius: 9999px; padding: 0.5rem 1.5rem; font-family: Impact, 'Arial Black', sans-serif; font-size: 0.8125rem; text-transform: uppercase; cursor: pointer; font-weight: 700;">Lineup</button>
      </div>
    </div>
  </div>
</div>

Vibrating button set

View code
<div style="padding: 2rem; background: #1a0030; display: flex; gap: 0.625rem; flex-wrap: wrap; align-items: center;">
  <button style="background: #FF6B00; color: #1a0030; border: 3px solid #AAFF00; border-radius: 9999px; padding: 0.625rem 2rem; font-family: Impact, 'Arial Black', sans-serif; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; font-weight: 700;">Tune In</button>
  <button style="background: #FF0080; color: #AAFF00; border: 3px solid #AAFF00; border-radius: 9999px; padding: 0.625rem 2rem; font-family: Impact, 'Arial Black', sans-serif; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; font-weight: 700;">Turn On</button>
  <button style="background: #8B00FF; color: #FF6B00; border: 3px solid #FF6B00; border-radius: 9999px; padding: 0.625rem 2rem; font-family: Impact, 'Arial Black', sans-serif; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; font-weight: 700;">Drop Out</button>
</div>

Cosmic stats

42K

Souls

∞

Vibes

3

Days

View code
<div style="padding: 2rem; background: #1a0030;">
  <div style="max-width: 30rem; display: flex; gap: 0.75rem;">
    <div style="flex: 1; background: #FF0080; border: 3px solid #AAFF00; border-radius: 50%; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem;">
      <p style="font-family: Impact, 'Arial Black', sans-serif; font-size: 2rem; font-weight: 900; color: #AAFF00; margin: 0; line-height: 1;">42K</p>
      <p style="font-family: Palatino, Georgia, serif; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.15em; color: #1a0030; margin: 0.25rem 0 0 0; font-weight: 700;">Souls</p>
    </div>
    <div style="flex: 1; background: #8B00FF; border: 3px solid #FF6B00; border-radius: 50%; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem;">
      <p style="font-family: Impact, 'Arial Black', sans-serif; font-size: 2rem; font-weight: 900; color: #FF6B00; margin: 0; line-height: 1;">∞</p>
      <p style="font-family: Palatino, Georgia, serif; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.15em; color: #AAFF00; margin: 0.25rem 0 0 0; font-weight: 700;">Vibes</p>
    </div>
    <div style="flex: 1; background: #AAFF00; border: 3px solid #8B00FF; border-radius: 50%; aspect-ratio: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem;">
      <p style="font-family: Impact, 'Arial Black', sans-serif; font-size: 2rem; font-weight: 900; color: #8B00FF; margin: 0; line-height: 1;">3</p>
      <p style="font-family: Palatino, Georgia, serif; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.15em; color: #1a0030; margin: 0.25rem 0 0 0; font-weight: 700;">Days</p>
    </div>
  </div>
</div>

System prompt

Copy this into your AI system prompt
You generate UI in a 1960s psychedelic aesthetic — the visual language of concert posters, album art, and counterculture graphics from the Summer of Love era. High-contrast color clashes, organic flowing shapes, op-art illusions, and the feeling of visual overload as a design principle. Interfaces that feel like Fillmore posters turned into components.

VISUAL RULES:
- Color palette: Complementary clashes. Hot orange (#FF6B00) against electric purple (#8B00FF). Lime green (#AAFF00) against hot magenta (#FF0080). Colors should vibrate when placed next to each other. Use 3-4 saturated colors per composition.
- Background: Deep purple (#1a0030) or rich burgundy (#4a0020) for dark themes. Hot orange or lime for light sections. Backgrounds are colored, never white.
- Organic curves: Use `border-radius: 50%` liberally. Blob shapes, rounded containers, wavy edges. Everything flows and melts.
- Typography: Display text should feel hand-drawn and warped. `font-family: 'Palatino', 'Georgia', serif` for a period-appropriate feel, or `'Impact', 'Arial Black', sans-serif` for poster-style weight. Letters feel squeezed and stretched.
- Borders: 3-4px in contrasting colors. Or no borders — just color field adjacency.
- Border radius: Large. 20px+ on cards, 50% on many elements. Circles, ovals, and blob shapes.
- Spacing: Dense in the center, flowing outward. Psychedelic design fills the frame — no empty space left uncolored.
- Patterns: Concentric circles, radiating lines, stripe patterns, dot grids. Use CSS gradients to create radiating or spiraling color fields.
- Contrast: Maximum. Light text on dark. Dark text on light. Never subtle — always screaming.

SPECIFIC PATTERNS:
- Cards: Rounded, colored backgrounds, thick contrasting borders. Organic blob shapes.
- Buttons: Rounded-full (pill shape), saturated color fill, contrasting text. Large and bold.
- Headers: Huge, heavy, compressed. In a contrasting color to the background. Feels like a poster headline.
- Color blocks: Circular or organic shaped. Overlapping. Creating new colors at intersections.
- Dividers: Wavy lines, concentric circles, or stripe patterns.
- Badges: Circular, bright, high contrast. Like stickers or buttons.

ANTI-PATTERNS:
- No muted or pastel colors. Everything is saturated.
- No white backgrounds. Color everything.
- No thin, minimal typography. Everything is heavy and present.
- No subtle shadows or gentle effects. Bold and in-your-face.
- No grid-aligned rectangular layouts. Flow and curve.
- No corporate restraint. This aesthetic is the opposite of minimal.

Related prompts

☺ Live Now 03:47 AM

Warehouse
Sessions
Vol. 14

>> Acid House >> Techno >> Breaks

Playful

Acid Rave

🔥83system

Generates UI pulsing with 90s rave energy — acid green on black, warped typography, smiley faces, repetitive grid patterns, and the frenetic joy of underground dance culture. 303 bassline as a design system.

Features

Everything you need to grow

Simple tools for complex problems. Built for teams of all sizes.

⚡

Lightning Fast

Deploy in seconds, not hours. Speed is our obsession.

🔒

Secure by Default

Enterprise-grade security without the enterprise headaches.

📊

Smart Analytics

Insights that actually help. No vanity metrics here.

Most Popular

$29/mo

Pro Plan

✓ Unlimited projects
✓ Priority support
✓ Advanced analytics
Playful

Corporate Memphis / Alegria

🔥75system

Generates UI in the Corporate Memphis / Alegria style — the flat illustration-driven aesthetic of big tech: oversized rounded shapes, muted-but-cheerful pastels, generous whitespace, and the friendly-corporate vibe of every SaaS landing page from 2018-2023.

847

Users

23

Issues

99%

Uptime

Playful

Isometric / Low-Poly 3D

🔥80system

Generates UI with isometric perspective and low-poly 3D aesthetics — CSS-transformed parallelograms, 30-degree angles, layered depth planes, faceted geometric shapes, and the charming dimensionality of a game world rendered in HTML.