Design

Dark LibraryAppllama Style

You might say

I want that Appllama feeling: dark ground, dense cards, a touch of gold — a site that visibly holds a library.

Dark Library is the style of near-black grounds, a single gold accent and dense card grids — turning a content site into an archive with ceremonyIt wins on three moves: dark removes ambient noise so cover art becomes the only light source; one accent color (usually gold) used sparingly is what reads as premium; and high card density sells 'volume' itself as credibility. The cost: long-form reading and colorful demos need adaptation work.

Also calledAppllama styledark library素材库 dark

Design Principles

Ground near-black but not pure (#141519 range); cards sit one step brighter — layer by lightness, not shadows
One accent site-wide: gold only on brand marks, active filters and the primary CTA
Dense cards: logo, name, one line — tighten leading, drop decoration
Cover art is the protagonist: lift imagery to near-white-ground brightness so it glows
Cool grays for text: #ECEEF2 primary, #8B8E99 secondary — no big blocks of pure white
Light and dark are one design: same layout, swapped ramps — selection is a gold outline on dark, a cream fill on light; the three-step grey inverts with the theme

Dark Library≠Dark UI

Dark UI is just the inverted palette applied anywhere; Dark Library adds hard constraints — one gold accent and a collectible, dense card grid. It sells the feeling of a stocked archive.

Dark Library≠Neo-Brutalism

Both dare with strong color, but brutalism is light ground, thick black borders, hard shadows; Dark Library is quiet layers of lightness on dark ground.

AI Prompt

Restyle this content site as a Dark Library: ground #141519, cards #20222A layered by brightness without shadows; the only accent is gold #E8C767, limited to brand mark, active filter chips and primary buttons; card grid 3-4 per row with logo + name + one line; wrap existing interactive demos in a light 'viewing card' to avoid color casts. Keep all functionality and copy unchanged.Also provide the matching light-theme values (cards #FFFFFF, borders #E4E4E7, text #1A1B20); both modes share one layout — the theme switch only changes tokens.

Typical use cases

Collection wall · dark card grid

Scroll sideways to explore the full example

BUILDHUBPRO12 saved

AllFrontendDesign StylesAssets

Cursor

AI code editor

Linear

Issues & sprints

Raycast

Mac launcher

Figma

Design collaboration

Buffer

Social scheduler

Appllama

AI product index

Fictional mockup · icons are real product logos

Reading view · column + rail

Scroll sideways to explore the full example

DESIGN STYLE · DARK LIBRARY

Dark Library

Treat every card like an exhibit: the single gold accent points only at what matters right now.

On a dark ground, logos sink — so every real icon sits on a small white tile.

Reference apps

On this page

What it is

Principles

Vs. minimalism

Prompt it

Unlock the full index

Unlimited saves · theme packs

Start trial

PRO paywall · single gold accent

Scroll sideways to explore the full example

✦

BuildHub PRO

For people shipping seriously

Monthly

$3.9/mo

Save 31%

Yearly

$29/yr

✓Unlimited saves & sync

✓Dark index view + export

✓Early access to new styles

Start 7-day free trial

No charge now · cancel anytime

Fictional mockup · icons are real product logos

Light & dark, one layout

Scroll sideways to explore the full example

DarkLight

Cursor

AI editor

Figma

Design tool

Dark · select = gold outline

Cursor

AI editor

Figma

Design tool

Light · select = cream fill

Same layout and components — only the ramps flip: cards #202228↔#FFFFFF, borders #2C2F38↔#E4E4E7, the three-step grey inverts with the theme