{"id":"c47654a9-7d7a-4b2c-8e0a-cd9296719c69","source":{"name":"Refero","url":"https://styles.refero.design/","kind":"public-design-reference"},"contributors":[{"name":"Refero","role":"reference-helper","url":"https://styles.refero.design/"}],"attributionLabel":"Referenced with help from Refero","sourceUrl":"https://styles.refero.design/style/c47654a9-7d7a-4b2c-8e0a-cd9296719c69","originalSiteUrl":"https://haleys.design","capturedAt":"2026-04-30T03:24:46.654Z","licenseNote":"Public design-reference facts mirrored from Refero for agent context. Keep source attribution visible and verify rights before reusing media, logos, or brand assets.","name":"Haley Park","summary":"Gothic manuscript on dark parchment","description":"Haley Park employs a 'Gothic manuscript' aesthetic: a deeply saturated, muted forest green canvas provides a rich backdrop for delicate, antiqued typography, often accompanied by thin, almost calligraphic underlines or borders. Surface treatments are minimal, favoring ghostly lines and subtle background patterns over solid cards or elevation. The visual system feels quietly scholarly and meticulously crafted, with a restrained use of contrast to maintain a calm, focused atmosphere. The typography is a key expressive element, mixing classical serifs with a distinctive, almost whimsical display font.","industry":"design","colorScheme":"dark","colors":[{"name":"Forest Canopy","hex":"#143930","role":"Page background, heading background fills, primary surface. Creates a deep, contemplative atmosphere","group":"neutral"},{"name":"Parchment White","hex":"#f8f2de","role":"Primary text, link text, borders, decorative accents. Its slight warmth prevents a stark contrast with the dark background, maintaining the antique feel. Used for outlined ghost buttons","group":"neutral"},{"name":"Moss Line","hex":"#456859","role":"Subtle borders, secondary decorative elements, icon outlines. Offers just enough contrast for structural lines without disrupting the soft visual texture","group":"neutral"}],"typography":[{"role":"Primary body text, links, list items, and smaller headings. Its classic serif forms contribute to the traditional, manuscript-like character.","sizes":"16px, 19px, 21px, 22px, 27px, 32px","family":"EditorialOld","weight":"200","weights":[200],"lineHeight":"1.20, 1.30, 1.50","substitute":"Lora","letterSpacing":"0.0040em, 0.0050em"},{"role":"Display headlines – extremely light weight and tight tracking create an ethereal, elegant title that feels whispered rather than shouted.","sizes":"96px","family":"Wispy","weight":"100","weights":[100],"lineHeight":"1.00","substitute":"Recursive Sans","letterSpacing":"-0.96px at 96px"},{"role":"Auxiliary body text, helper text, and secondary information presented in a highly readable, classic serif.","sizes":"13px, 16px","family":"Old Standard TT","weight":"200","weights":[200],"lineHeight":"1.50","substitute":"Old Standard TT","letterSpacing":"normal"},{"role":"Secondary textual content, possibly for smaller annotations or details where a slightly more contemporary serif is desired.","sizes":"15px, 21px","family":"GTA","weight":"300","weights":[300],"lineHeight":"1.60","substitute":"Playfair Display","letterSpacing":"0.0040em"},{"role":"Decorative icons and ornamental text elements, evoking historical printing.","sizes":"16px, 21px","family":"bodoni-classic-ornaments","weight":"200, 300, 400","weights":[200,300,400],"lineHeight":"1.44, 1.50","substitute":"Decorative Dingbats or Zapf Dingbats","letterSpacing":"0.0110em"},{"role":"A distinct heading font for specific sections, offering a unique, elegant serif character that complements the primary heading style.","sizes":"27px","family":"altesse-std-24pt","weight":"300","weights":[300],"lineHeight":"1.10","substitute":"Perpetua Titling MT","letterSpacing":"normal"},{"role":"ui-sans-serif — detected in extracted data but not described by AI","sizes":"16px","family":"ui-sans-serif","weight":"100, 400","lineHeight":"1.5"}],"typeScale":[{"role":"caption","size":16,"lineHeight":1.3},{"role":"body-sm","size":19,"lineHeight":1.3},{"role":"body","size":21,"lineHeight":1.3},{"role":"body-lg","size":22,"lineHeight":1.3},{"role":"heading-sm","size":27,"lineHeight":1.3},{"role":"heading","size":32,"lineHeight":1.3}],"spacing":{"radius":{"circle":"64px","default":"4.8px"},"elementGap":"11px","sectionGap":"26px","cardPadding":"26px"},"radius":{"circle":"64px","default":"4.8px"},"guidelines":{"do":["Prioritize Forest Canopy (#143930) for all main backgrounds to maintain the deep, dark ambiance.","Use Parchment White (#f8f2de) exclusively for primary text, links, and borders, reserving it for elements that need to stand out from the dark background.","Apply Moss Line (#456859) for secondary decorative strokes, subtle outlines, and subdued graphic elements to add detail without high contrast.","Employ the 'Wispy' font (96px, 100 weight, -0.96px letter-spacing) for primary hero headlines to achieve an ethereal, elegant feel.","Structure interactive elements like navigation and project listings with text on transparent backgrounds, using only a Parchment White (#f8f2de) border or underline for definition.","Maintain a comfortable density with element gaps at `11px` and section gaps at `26px` to allow content to breathe without feeling sparse.","Utilize 0px border-radius for components like project cards and buttons to reinforce a sharp, traditional print aesthetic."],"dont":["Avoid using bright, saturated colors for UI elements; stick to the muted palette provided.","Do not introduce heavy shadows or prominent elevation; maintain a flat, layered visual approach with subtle outlines.","Refrain from using bold or heavy font weights for headlines or primary text where lightness and elegance are key.","Do not use large, solid background fills for interactive components; prefer ghost styles with borders or underlines.","Avoid decorative imagery that clashes with the site's 'Gothic manuscript' aesthetic; prioritize line art, subtle textures, or classic ornaments.","Do not deviate from the specified typefaces and their distinct letter-spacing values to preserve the unique typographic voice.","Avoid arbitrary border radii; use 0px by default, and 4.8px very sparingly for elements that require a slight softening."]},"components":[{"name":"Ghost Navigation Link","role":"Header navigation items and project links"},{"name":"Project Card (Outlined)","role":"Containers for project listings, often appearing in grid layouts."},{"name":"Section Divider with Text","role":"Visual separation between content sections, enhanced with centered text"},{"name":"Ornamental Icon","role":"Decorative crosses or geometric patterns"}],"customSections":[{"title":"Agent Prompt Guide","content":"### Quick Color Reference\ntext: #f8f2de\nbackground: #143930\nborder: #f8f2de\naccent: no distinct accent color\nprimary action: no distinct CTA color\n\n### 3-5 Example Component Prompts\n1. Create a primary headline for a new section: 'Latest Works' using 'Wispy' font, 96px, weight 100, letter-spacing -0.96px, color Parchment White (#f8f2de).\n2. Generate a ghost navigation link for 'Contact' using 'EditorialOld' font, 19px, weight 200, color Parchment White (#f8f2de), with a 1px bottom border in Parchment White (#f8f2de).\n3. Design a sub-heading: 'Productivity Tools' using 'altesse-std-24pt' font, 27px, weight 300, color Parchment White (#f8f2de), against a Forest Canopy (#143930) background.\n4. Create a project card entry with the text 'AI Integration' (EditorialOld, 16px, Parchment White (#f8f2de)) and a sub-text '2023-2024' (Old Standard TT, 13px, Parchment White (#f8f2de)), inside a transparent container with a 1px Parchment White (#f8f2de) border and 0px radius."}],"media":{"screenshotUrl":"https://ysxnuuuj3kqhdyj2.public.blob.vercel-storage.com/1777519465539-screenshot.jpg","thumbnailUrl":"https://ysxnuuuj3kqhdyj2.public.blob.vercel-storage.com/1777519465539-thumb.jpg"},"similarStyleIds":["703d69b7-2863-44fa-a443-2ac090db3873","d56508d7-c307-47f7-ad30-052e5a69f01f","11764fe0-e246-4b17-b3fb-a5d567466355","8d8d5861-dee0-431b-826d-56f3fa4e1f84","37215d07-9e4e-4cef-ad58-65d111caba19","3e70af05-a07f-4c11-98ca-6ecb4765e967","edc0c03e-8c20-4e22-badd-2735fcb9f4a8","edea6c5b-000a-441e-bc26-e0076c335177","139c4bee-396d-494c-baf0-fe211bf4928d","fece962d-a580-4365-8afd-c9905a2502b1","75270aed-5ae1-4f41-80df-1b137dc0916a","ab1b113a-ed21-4512-acc2-d10c8927c410","908017b4-311c-4b89-afa5-c29c8cb08e8b","a90dbcb6-e42c-4992-a83b-94879699dd4f","df452116-6b43-4963-991b-ebae892c8dc1","2c18e573-0ffb-4f0d-848c-ff72a5839fd3","c46ecd77-9c92-4a85-9162-c6d4afd99d95","ff4b9eff-dc0b-4886-bd65-c2f5e9069318","25009c35-8b3b-4898-9295-3e0e0aa07207","2d4fc4ba-2ea4-465f-8644-f3ff5c6713a2"],"exports":{"designMdUrl":"/references/refero/c47654a9-7d7a-4b2c-8e0a-cd9296719c69/design.md","tokensJsonUrl":"/references/refero/c47654a9-7d7a-4b2c-8e0a-cd9296719c69/tokens.json","tailwindV4Url":"/references/refero/c47654a9-7d7a-4b2c-8e0a-cd9296719c69/tailwind-v4.css","cssVariablesUrl":"/references/refero/c47654a9-7d7a-4b2c-8e0a-cd9296719c69/tailwind-v4.css"}}