GOTHIC
DocsStyleKit →

哥特式风格 · Stilus Gothicus

GOTHIC

In tenebris et umbra, pulchritudo latet.

In darkness and shadow, beauty lies hidden.

Scroll to Explore

Architectura Sacra

Cathedral Architecture

✦
✧
✦

Arcus Acutus

The Pointed Arch

The pointed arch redirects structural weight outward, allowing walls to soar beyond Romanesque limits. This architectural revelation became the defining form of the Gothic aesthetic — upward, always upward.

Fenestra Orbiculata

The Rose Window

Stained glass transformed stone walls into vessels of divine light. Each colored panel narrates scripture to an illiterate populace through the universal language of luminous color.

I

Verticalitas

Verticality

Everything reaches upward — spires, arches, nave columns. The vertical line is a symbolic gesture toward the divine, away from the earthly.

II

Lux et Umbra

Light & Shadow

The greatest achievement of Gothic architecture is sacred light within stone. Gold against darkness mirrors grace against sin.

III

Ornamentum

Ornamentation

Gargoyles serve as waterspouts and spiritual guardians. Every decorative element has structural or symbolic purpose.

Elementa Designi

Sacred Forms

✦
✧
✦

Navis Cathedralis

The Nave

The central passage where pilgrims gather beneath soaring vaulted ceilings of stone and shadow, drawn toward the altar by divine geometry and the smell of incense.

Fenestra Rosae

Rose Window

Stained glass petals radiate outward from a sacred center, flooding the interior with colored divine light at each turning of the sun.

Claustrum Sanctum

The Cloister

Silent arcaded corridors where contemplation deepens and footsteps echo against ancient stone worn smooth by centuries of devotion.

Tactus — Button Variants

Petitio — Sacred Form

Philosophia Designi

Gothic Philosophy

✦
✧
✦

Pointed Arch Principle

The pointed arch redirects weight outward and downward, allowing walls to soar higher than was ever possible in the Romanesque tradition. This structural revelation became the defining form of Gothic aesthetic.

In design: use vertical emphasis, sharp angles, and upward-reaching compositions. Never settle for horizontal sprawl when vertical aspiration is achievable.

Gothic aesthetics are rooted in the medieval preoccupation with mortality and the transience of earthly existence. Death was not morbid but instructive — a reminder that only the eternal matters. This solemn awareness gives Gothic design its gravity and weight.

Chromata et Litterae

Color & Typography

✦
✧
✦

Primary

Deep Purple

#2d1b4e

Cathedral shadow

Secondary

Blood Red

#8b1a1a

Sacred wound

Accent

Sacred Gold

#c9a227

Divine light

Ground

Near Black

#0a0a0a

The void

Support

Medium Purple

#4a2d6e

Dusk cloister

Hierarchy Display

GOTHIC

H1 · serif · tracking-wider · gold glow

Sanctum Altare

H2 · serif · blood red · tracking-wider

Via Crucis

H3 · serif · gold/70 · uppercase

Sub specie aeternitatis, omnia mutantur.

Body · serif · italic · gold/55

Captions & Labels

Caption · tracking-[0.4em] · gold/35

Illuminated Quote

“In the shadow of the cathedral, the soul learns to see without eyes — perceiving the divine in the play of light across ancient stone.”

— Vita Cathedralis

Drop Cap

Darkness is not the absence of light. It is the canvas upon which light inscribes its most sacred revelations. Without the void of the cathedral walls, the rose window would be merely colored glass — meaningless and mute.

Proclamationes — Alert States

✓

Blessed — Ritual Complete

The sacred operation has been fulfilled.

⚠

Omen — Heed the Warning

Dark forces stir at the edges of perception.

✕

Cursed — Ritual Failed

Something ancient and malevolent has intervened.

ℹ

Prophecy — Ancient Knowledge

The scrolls speak of things yet to come.

Sacred Archive — Dropdown

Sigilla — Orders & Badges

TemplarHospitallerTeutonicSantiagoCalatrava
BlessedCursedSealedForbidden

Vitae Sanctorum

Illuminated Manuscripts

✦
✧
✦
I

Horae Canonicae

The Hours

From Matins before dawn to Compline at dusk, the canonical hours organize sacred time. Each hour is a brushstroke in the illuminated manuscript of the day.

II

Liber Bestiarum

The Bestiary

Fantastic creatures populate the margins of medieval manuscripts. Each beast a symbol encrypted in vellum — dragons for sin, unicorns for purity.

III

Psalterium Aureum

The Psalter

The Golden Psalter of St. Gallen: each page a devotional labor lasting months. Gold leaf laid over gesso catches candlelight and sanctifies the written word.

“Architecture is frozen music, and Gothic architecture is the grandest symphony ever composed in stone — a hymn to the infinite, written in arches and shadows.”

Schopenhauer · Adapted

Regulae Monasticae

Sacred Rules

✦
✧
✦

†Mandatum — Must Follow

  • †Deep purple, blood red, near-black as the foundation palette
  • †Gold (#c9a227) accents for all luminous focal points
  • †Serif fonts for all titles, headings, and body text
  • †tracking-wider or tracking-widest on all important text
  • †Dark backgrounds throughout — no white or light sections
  • †Gold borders at 20–60% opacity for structural definition
  • †Pointed arch shapes and upward-reaching compositions
  • †Latin mottos and italicized phrases for gravitas
  • †Slow transitions (duration-700) for candlelight feel

×Prohibitum — Never Do

  • ×Bright or cheerful colors — pastels, neons, vivid primaries
  • ×Cute, rounded, or playful design elements
  • ×Modern sans-serif as main title fonts
  • ×Overly minimalist design stripped of ornament
  • ×White or very light section backgrounds
  • ×Casual or informal tone in copy or labels
  • ×Flat, shadowless modern UI patterns
  • ×Horizontal sprawl instead of vertical aspiration
  • ×Quick bouncy or spring-like animations

Motus Animarum — Interaction Principles

Candlelight Enhancement

duration-700

All hover transitions take 700ms — the unhurried flicker of a candle, never the snap of electricity.

Gold Border Glow

hover:shadow-[0_0_40px_rgba(201,162,39,0.2)]

On hover, borders intensify and a soft gold halo appears, as if touched by sacred light from within.

Shadow Intensification

group-hover:border-[#c9a227]/80

Corner ornaments sharpen from faint traces to vivid gold on interaction, revealing hidden structure.

Gothic · StyleKit

In tenebris lux — In darkness, light

哥特式风格 · Medieval Cathedral Aesthetics

GOTHIC

Documentation →StyleKit →
✦Aedificatum in aeternum✦