Editorialsystem

Organic Naturalist

🔥 Certified BangerThis prompt produces genuinely distinct output

Generates UI inspired by the natural world — forest greens, warm terracotta, botanical line art, natural paper textures, and the grounded warmth of a field guide or herbarium catalog.

earth tonesbotanicalnaturalwarm tones

Added February 6, 2026 by unslop.dev

Example output

Specimen card

Specimen No. 47 · Perennial

Helleborus orientalis

Lenten Rose

A hardy evergreen that blooms in late winter, producing nodding flowers in shades of cream, green, and plum. Prefers partial shade and humus-rich soil. Remarkably tolerant of neglect.

Hardiness: 4–9 Height: 30–45cm Bloom: Feb–Apr

View code

<div style="padding: 2rem; background: #f5f0e6;">
  <div style="background: #ebe5d7; border: 1px solid #d4c9b8; padding: 2rem; max-width: 24rem;">
    <div style="font-variant: small-caps; font-family: 'Georgia', serif; font-size: 0.6875rem; letter-spacing: 0.12em; color: #2d5016; margin-bottom: 0.625rem;">Specimen No. 47 · Perennial</div>
    <h3 style="font-family: 'Georgia', serif; font-size: 1.375rem; font-weight: 700; color: #3d3429; margin: 0 0 0.25rem 0; line-height: 1.3;">Helleborus orientalis</h3>
    <p style="font-family: 'Georgia', serif; font-style: italic; font-size: 0.875rem; color: #8a7d6b; margin: 0 0 1rem 0;">Lenten Rose</p>
    <div style="border-top: 1px solid #d4c9b8; padding-top: 1rem;">
      <p style="font-family: 'Georgia', serif; font-size: 0.875rem; color: #5e4d3b; line-height: 1.75; margin: 0 0 1.25rem 0;">A hardy evergreen that blooms in late winter, producing nodding flowers in shades of cream, green, and plum. Prefers partial shade and humus-rich soil. Remarkably tolerant of neglect.</p>
      <div style="display: flex; gap: 1.5rem; font-family: 'Georgia', serif; font-size: 0.75rem; color: #8a7d6b; font-style: italic;">
        <span>Hardiness: 4–9</span>
        <span>Height: 30–45cm</span>
        <span>Bloom: Feb–Apr</span>
      </div>
    </div>
  </div>
</div>

Catalog section header

Section IV — Woodland Perennials

Plants for Shade & Dappled Light

The species catalogued in this section thrive beneath the canopy — in the filtered light and rich, moist soils of the forest floor. Many bloom before the trees leaf out in spring.

42 specimens · Last updated February 2026

View code

<div style="padding: 2rem; background: #f5f0e6;">
  <div style="max-width: 36rem;">
    <div style="display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem;">
      <span style="display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2d5016;"></span>
      <span style="font-variant: small-caps; font-family: 'Georgia', serif; font-size: 0.75rem; letter-spacing: 0.12em; color: #2d5016;">Section IV — Woodland Perennials</span>
    </div>
    <h2 style="font-family: 'Georgia', serif; font-size: 1.75rem; font-weight: 700; color: #3d3429; margin: 0 0 0.625rem 0; line-height: 1.25;">Plants for Shade & Dappled Light</h2>
    <p style="font-family: 'Georgia', serif; font-size: 0.9375rem; color: #5e4d3b; line-height: 1.75; margin: 0 0 1.25rem 0;">The species catalogued in this section thrive beneath the canopy — in the filtered light and rich, moist soils of the forest floor. Many bloom before the trees leaf out in spring.</p>
    <div style="border-top: 1px solid #d4c9b8; padding-top: 0.5rem;">
      <span style="font-family: 'Georgia', serif; font-style: italic; font-size: 0.8125rem; color: #8a7d6b;">42 specimens · Last updated February 2026</span>
    </div>
  </div>
</div>

Filter bar

Filter by:

View code

<div style="padding: 1.5rem; background: #f5f0e6;">
  <div style="max-width: 36rem; display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;">
    <span style="font-family: 'Georgia', serif; font-size: 0.75rem; font-style: italic; color: #8a7d6b;">Filter by:</span>
    <button style="background: #2d5016; color: #f5f0e6; border: 1px solid #2d5016; padding: 0.3125rem 0.875rem; font-family: 'Georgia', serif; font-size: 0.75rem; cursor: pointer; border-radius: 2px;">All Species</button>
    <button style="background: transparent; color: #5e4d3b; border: 1px solid #d4c9b8; padding: 0.3125rem 0.875rem; font-family: 'Georgia', serif; font-size: 0.75rem; cursor: pointer; border-radius: 2px;">Perennials</button>
    <button style="background: transparent; color: #5e4d3b; border: 1px solid #d4c9b8; padding: 0.3125rem 0.875rem; font-family: 'Georgia', serif; font-size: 0.75rem; cursor: pointer; border-radius: 2px;">Annuals</button>
    <button style="background: transparent; color: #5e4d3b; border: 1px solid #d4c9b8; padding: 0.3125rem 0.875rem; font-family: 'Georgia', serif; font-size: 0.75rem; cursor: pointer; border-radius: 2px;">Shade-Loving</button>
    <button style="background: transparent; color: #5e4d3b; border: 1px solid #d4c9b8; padding: 0.3125rem 0.875rem; font-family: 'Georgia', serif; font-size: 0.75rem; cursor: pointer; border-radius: 2px;">Native</button>
  </div>
</div>

System prompt

Copy this into your AI system prompt

You generate UI in an organic naturalist style — the visual language of botanical illustrations, field guides, and herbarium catalogs. Forest greens, warm earth tones, natural paper textures, and the careful beauty of scientific illustration. This is nature observed with love and precision. Warm, grounded, and alive.

VISUAL RULES:
- Background: Natural paper. #f5f0e6 (warm cream) or #ebe5d7 (darker parchment). The slight yellowish warmth of paper that's spent time near plants. Never cold white.
- Greens: Forest (#2d5016), sage (#6b7f5a), olive (#8a8c5a), moss (#4a6741). Multiple greens used together, like a botanical plate. Forest green is the primary accent.
- Earth tones: Terracotta (#b85c38), clay (#c49a6c), warm brown (#6b4c30), charcoal (#3d3429).
- Text: Dark earth (#3d3429) for headings. Warm brown (#5e4d3b) for body. Muted (#8a7d6b) for secondary. Always warm-tinted.
- Typography: Elegant serif for headings. `font-family: 'Libre Baskerville', 'Baskerville', 'Georgia', serif`. Body in readable serif: same family, regular weight. Italic encouraged for specimen names and labels (as in botanical convention).
- Borders: Warm and thin. `border: 1px solid #d4c9b8`. Cards may use double borders for a plate/frame effect.
- Decorative elements: Thin botanical-style lines. Simple leaf or branch motifs using CSS borders and curves (or Unicode: 🌿 sparingly). Thin dotted lines for labels (like specimen annotations). Small circles (●) as list bullets in green.
- Spacing: Generous, specimen-like. p-6 to p-8 in cards. Content well-separated, like labeled specimens in a display case.
- Border radius: Minimal. 2-4px at most. Scientific precision, not playful curves.

SPECIFIC PATTERNS:
- Cards: Parchment bg, thin warm border, p-6. Uppercase small-caps label in green above title. Serif title. Description in warm body text. Feels like a catalog entry.
- Specimen labels: Small, italic, green or brown text. Positioned like museum labels. May include a thin dotted leader line.
- Buttons: Border 1px warm-brown, transparent bg, serif text. Hover: subtle green bg/10. Never aggressive. Reads like a catalog action: "View Specimen →".
- Section headers: Green small-caps label above, serif heading, thin warm rule below. Like a field guide chapter opener.
- Metadata: Italic, small, warm gray. "Collected February 2026 · Genus: Interfacea · Plate XII".
- Color accents: Small dots, thin lines, or borders in forest green. Terracotta for secondary accent (links, active states).

ANTI-PATTERNS:
- No neon or saturated modern colors. Nature doesn't glow.
- No dark mode. This lives in natural daylight.
- No sans-serif headings. Serif authority for scientific/editorial feel.
- No heavy shadows. Subtle at most. Paper is flat.
- No gradients. Flat, natural colors only.
- No tech/industrial aesthetics. No monospace, no uppercase-everything.

Related prompts

Desert Journal

Finding calm in the red rock

The desert teaches patience. Every formation was carved by millennia of wind and water — the original slow design process.

nature reflection

Editorial

Terracotta Earth

🔥81system

Generates UI with sun-baked desert warmth — clay oranges, dried sage, sandstone textures, and the grounded beauty of Southwestern architecture. Adobe walls as a design system.

Editorial

The Art of Interface Typography

How the best digital products use type scale, measure, and rhythm to create reading experiences that feel effortless.

typography design

Stay in the loop

A short email when we publish something worth reading. No spam, no filler.

Join 2,400 designers and developers.

Editorial

Warm Editorial

🔥92system

Generates UI with the feel of a well-designed independent magazine — off-white backgrounds, terracotta accents, generous whitespace, and typography that breathes. Serif headings optional.

§ Philosophy

On the Consolation of Reading in Dark Hours

There exists in every library a particular hour when the shelves seem to lean inward, conspiratorial, offering exactly the volume one needs without knowing one needed it.

E. Blackwood 14 February 2026

"A room without books is like a body without a soul. But a room with too many books is like a soul that has forgotten its body."

—Marcus Tullius Cicero, adapted

Editorial

Dark Academia

🔥87system

Generates UI with the aesthetic of a university library at midnight — dark wood tones, parchment cream, burgundy accents, serif typography, and the quiet intensity of candlelit scholarship.