~ A Design Aesthetic Reference ~

Goblincore

Celebrating the overlooked treasures of the forest floor: mushrooms, moss, snails, toads, pebbles, acorns, and muddy earth in all its imperfect charm.

🍄 🪨 🍀 🐌 🍂

📚 Field Notes: Overview

Goblincore is an aesthetic that celebrates the overlooked treasures of the forest floor: mushrooms, moss, snails, toads, pebbles, acorns, and muddy earth in all its imperfect charm. It rejects polished beauty in favor of the organic, the grimy, and the wonderfully irregular.


In digital design, Goblincore translates into warm earth-tone palettes, hand-drawn textures, deliberately imperfect layouts, and a celebration of natural curiosities that feel like they were foraged from a damp woodland path and arranged on a rough wooden table.

🍄 Visual Characteristics

Core design traits of the Goblincore aesthetic

🍄

Mushroom & Moss Motifs

Toadstools, bracket fungi, lichen textures, and dense moss patterns used as decorative and structural elements throughout the design.

🌎

Earth-Tone Warmth

A palette built from soil browns, forest greens, mushroom tans, and lichen yellows with occasional pops of toad-belly orange.

✏️

Handmade Imperfection

Rough edges, hand-drawn borders, slightly uneven spacing, and textures that feel tactile and organic rather than machine-precise.

💎

Found-Object Collections

Visual arrangements that resemble a nature table: pinecones, river stones, feathers, snail shells, and acorns displayed as treasures.

🌲

Damp Forest Atmosphere

Dark, humid-feeling backgrounds with dappled light filtering through canopy, creating a sense of being close to the ground.

📜

Rough Paper & Bark Textures

Backgrounds that mimic torn paper, birch bark, weathered wood, and dried leaves for a tactile, layered feel.

🧪

Jar & Specimen Aesthetics

Content presented as if collected in glass jars, specimen boxes, or field notebooks. A naturalist's cabinet of curiosities.

🍀 design principles 🍀


🌈 Color Palette

Foraged from forest floor, lichen, and damp earth

Forest Floor #3B2F2F

Primary dark background, text

Toadstool Tan #C4A882

Card backgrounds, warm neutral

Moss Green #4A6741

Primary accent, headings

Lichen Yellow #B8A44C

Secondary accent, highlights

Mushroom Cap #8B6F4E

Borders, secondary surfaces

Damp Earth #5C4033

Dark panel backgrounds

Snail Shell #D4C5A9

Light surfaces, paper texture

Toad Belly #C17817

Call-to-action, warm pop accent

Fern Green #6B8E5A

Tertiary accent, decorative fills

River Stone #8E8E8E

Muted text, subtle details

🛠 CSS Custom Properties

Copy-paste ready variables for your projects

:root {
--goblin-forest-floor: #3B2F2F; --goblin-toadstool: #C4A882; --goblin-moss: #4A6741; --goblin-lichen: #B8A44C; --goblin-mushroom-cap: #8B6F4E; --goblin-damp-earth: #5C4033; --goblin-snail-shell: #D4C5A9; --goblin-toad-belly: #C17817; --goblin-fern: #6B8E5A; --goblin-river-stone: #8E8E8E; }

📝 Typography

Handwritten warmth meets old-book readability

Primary Heading Caveat
The forest floor hides treasures beneath every fallen leaf and mossy stone.
400 Regular 500 Medium 600 SemiBold 700 Bold
Hand-drawn, journal-like script for headings
Decorative Heading Amatic SC
Collect every pebble, every feather, every curious thing
400 Regular 700 Bold
Tall, narrow, hand-lettered feel for decorative headings
Body Text Libre Baskerville
A warm, readable serif that feels like old book pages. The snail carries its home upon its back, spiraling through the damp underbrush where bracket fungi grow in layered shelves along the fallen oak. Every stone in the creek bed tells a story written in geological time.
400 Regular 400 Italic 700 Bold
Warm, readable serif for body text -- feels like old book pages
Labels & Captions Patrick Hand
Found this specimen under the third oak past the old stone wall. Cap diameter approximately 4cm. Gills are cream-colored with brown spore print.
400 Regular
Informal labels, captions, and handwritten annotations
Alternative Body Merriweather
An alternative body serif with sturdy readability, perfect for longer passages where the text needs to carry the reader through descriptions of rain-soaked forest paths and the small wonders hiding beneath rotting logs.
300 Light 400 Regular 700 Bold
Sturdy readability as an alternative body serif
Field Journal Warmth
Caveat 700 paired with Libre Baskerville 400 creates the feeling of warm storytelling in a hand-bound field journal.
Mood: Field journal, warm storytelling
Whimsical Naturalist
Amatic SC 700 paired with Merriweather 400 evokes a whimsical storybook written by a woodland naturalist.
Mood: Whimsical naturalist, storybook
Handwritten Notes
Patrick Hand 400 with Libre Baskerville 400 feels like handwritten annotations scrawled in the margins of old pages.
Mood: Handwritten notes on old pages

📌 Layout Principles

How to arrange your foraged treasures on the page

Asymmetric Organic Grid

Avoid rigid symmetry. Let content blocks feel like objects scattered on a table, with slightly irregular spacing and varied sizes.

Layered Textures

Use paper textures, wood grain, or moss patterns behind content areas to create tactile depth and visual richness.

Collection-Style Arrangement

Group related elements as if curating a nature specimen display: small cards clustered with varied heights, overlapping edges optional.

Field-Notebook Sections

Style content sections like torn notebook pages with ragged edges, tape-strip decorations, or pencil-line borders.

Irregular Shapes

Avoid perfectly geometric containers. Prefer slightly irregular border-radius or wavy SVG clip-paths for organic character.

Responsive: Pocket Field Guide

On mobile, stack collection items vertically while preserving rough textures and handmade typography. Let it feel like a pocket field guide.

🔧 CSS Techniques

Live demonstrations of Goblincore component patterns

Foraged Card

specimen #07

Bracket Fungus

A shelf-like fungus growing on the north side of a birch stump, layers of cream and brown.

Mossy Buttons

Specimen Tags

mushroom river stone acorn cap snail shell

Twig Divider

🍂 found objects 🍂

🐌

📖 Design Do's and Don'ts

A forager's guide to staying on the woodland path

Do

  • Use warm, muddy earth tones and muted forest greens throughout
  • Include hand-drawn or handwritten-style typography for headings and labels
  • Layer rough textures (paper, bark, moss) behind content for tactile depth
  • Embrace irregular shapes, uneven borders, and deliberate imperfection
  • Present content as curated collections of found treasures
  • Add small nature details: mushroom icons, leaf silhouettes, snail doodles
  • Keep the tone cozy, warm, and slightly whimsical

Don't

  • Use polished, corporate-looking layouts with perfect geometric grids
  • Apply bright white backgrounds or sterile minimalist spacing
  • Choose clean, geometric sans-serif fonts for headings
  • Use neon or synthetic colors that feel artificial and unnatural
  • Over-refine illustrations -- Goblincore thrives on charming roughness
  • Mix with high-tech, futuristic, or cyberpunk aesthetics
  • Make everything perfectly symmetrical and aligned