UI はローカライズ済みです。スキルの紹介と説明文書は選択した言語へ AI が自動翻訳し、コード・コマンド・パス・専門用語は原文のままです。原作者の文書が優先されます。
スキルを探す
生産性・共同作業 · SKILL.md

vintage

vintage

Aged paper, sepia tones, classic serifs, letterpress texture, antique warmth.

Independent GitHub snapshot · Automated classification · Original documentation governs

スキルの説明

GitHub

name: vintage description: Aged paper, sepia tones, classic serifs, letterpress texture, antique warmth.

Vintage

Mission

Evoke the tactile warmth of aged print — as if every page was pulled from a 1920s letterpress shop, worn at the edges and rich with history.

Brand

🎨 Colors

  • #5C3A21 — Primary (warm brown)
  • #8B6914 — Secondary (aged gold)
  • #F5F0E8 — Background (cream paper)
  • #E8DCC8 — Surface (aged parchment)
  • #2C1810 — Text (deep ink brown)
  • #8B4513 — Accent (saddle brown)

🔤 Typography

  • Heading font: Playfair Display (Google Fonts, elegant serif)
  • Body font: Lora (Google Fonts, readable serif)
  • Type scale: xs 0.75rem / sm 0.875rem / base 1.0625rem / lg 1.25rem / xl 1.563rem / 2xl 2.441rem / 3xl 3.052rem

📐 Spacing

  • Grid: 6-column (narrower, like vintage publications)
  • Section padding: 4rem vertical, 3rem horizontal
  • Card gaps: 2.5rem (generous breathing room)

🧩 Components

  • Buttons: Letterpress style — slight inner shadow, warm brown fill, cream text. Hover deepens the brown. Subtle 2px border-radius.
  • Cards: Cream surface with a darker deckled-edge border effect (CSS box-shadow for depth), optional ornamental corner flourishes.
  • Nav: Centered, spaced serif links with a thin gold ornamental divider below. Active state: italic + underline.
  • Hero: Large serif headline over a cream background, decorative rule lines above and below, optional vintage illustration or photograph.
  • Footer: Three-column with small serif headings, gold divider rule, copyright in italic.

♿ Accessibility

  • Warm brown on cream passes 4.5:1 — verify with contrast checker
  • Minimum body text size: 1rem (not 0.875rem)
  • Focus rings: 2px solid saddle brown, clearly visible on cream
  • prefers-reduced-motion: remove any subtle hover transitions

✍️ Writing Tone

Warm, refined, unhurried. Full sentences over bullet points. Embrace slightly formal constructions. No slang, no tech jargon unless the subject demands it.

Do / Don't

✅ Do

  1. Use paper textures (subtle noise, grain, or fiber overlays) on backgrounds
  2. Add ornamental details: rule lines, fleurons, drop caps, section dividers
  3. Embrace generous margins — vintage layouts breathe
  4. Use sepia-toned photography with vignette effects
  5. Layer depth with subtle box-shadows that mimic letterpress impression

❌ Don't

  1. Use pure black or pure white — always warm-toned
  2. Add neon colors, gradients, or modern glow effects
  3. Use sans-serif fonts for body text
  4. Fill every inch of space — vintage design values restraint
  5. Mix in flat-design or material-design conventions

Quality Gates

  • No pure black (#000) or pure white (#FFF) anywhere
  • At least one ornamental element (rule, fleuron, drop cap) present
  • Serif fonts used for all body text
  • Paper texture or grain effect visible on backgrounds
  • Color palette stays within warm brown/gold/cream spectrum
  • Photography (if used) is sepia-toned or warm-filtered
保存したスキル