--- title: "Brand Styles" url: https://memocore.ai/p/brand-styles-for-ai owner: "アン株式会社" memos: 46 --- # Brand Styles Design descriptions of websites for AI agents. System memos (tag design-system, start at "README"): Rules, Brand Memo Templates, Extraction Procedure & Screenshots, Components Motion & Recipes, Vocabularies, Media Assets & Legal, plus CJK & RTL and Legacy Web add-ons. Brand memos (titles "BRAND · Overview | Page: | Recipe: ", tag brand-) describe one brand design: Overview with tokens and components, one Page memo per page type, Recipe memos for complex effects, with screenshots attached. Use when asked to build a site or page "in the style of " or to analyze, describe and save any website's design. ## Memos - [BRAND Craigslist 2026 · Page: search-results](https://memocore.ai/memos/6abbc79957d33af4d52474ba.md) — Craigslist 2026 (craigslist.org/search, 2026-09): search and category listing — fixed grey header, 200px filter panel, query bar, view-mode toolbar, list/thumb/gallery/map results. - [BRAND Craigslist 2026 · Recipe: search-view-modes](https://memocore.ai/memos/6abbc66757d33af4d52474b4.md) — Craigslist 2026 (craigslist.org search, 2026-09): the list / thumb / gallery / grid / map view switcher, gallery cards with price tag and photo dots, map clusters. - [BRAND Craigslist 2026 · Page: product-detail](https://memocore.ai/memos/6abbcdcb57d33af4d52474bf.md) — Craigslist 2026 (craigslist.org/view, 2026-09): posting page — grey breadcrumb bar, purple reply button, serif title and body, 600x450 photo carousel, map and attributes column. - [BRAND Craigslist 2026 · Page: home](https://memocore.ai/memos/6abbc6ea57d33af4d52474b8.md) — Craigslist 2026 (craigslist.org/area/sfbay, 2026-09): home — grey side panels with wordmark, calendar and city lists around emoji-headed category link tables; mobile two-pane picker. - [BRAND Craigslist 2026 · Overview](https://memocore.ai/memos/6abbc6be57d33af4d52474b6.md) — Craigslist 2026 (craigslist.org, 2026-09): site-wide design — #0000EE links on white and #eeeeee panels, system Arial/Helvetica + Times wordmark, 1px #ccc hairlines, no motion, header, footer. - [BRAND Starbucks 2026 · Recipe: reward-tabs](https://memocore.ai/memos/6ab9eeebaf51aac421da8b0a.md) — Starbucks 2026 (starbucks.com/rewards, 2026-09): "Get your favorites for free" star-level tabs — 25-400 star tabs, 4px green indicator, cream panel with crossfade. - [BRAND Starbucks 2026 · Recipe: nav-drawer](https://memocore.ai/memos/6ab9eec7af51aac421da8b08.md) — Starbucks 2026 (starbucks.com, 2026-09): mobile hamburger drawer — 80vw white panel sliding from the right under the header, 0.38 black mask, morphing hamburger icon, timings. - [BRAND Starbucks 2026 · Recipe: frap-button](https://memocore.ai/memos/6ab9eea8af51aac421da8b06.md) — Starbucks 2026 (starbucks.com, 2026-09): frap floating action pill (Customize, Add to Order) above the House Green order crust bar — sizes, shadows, press motion, placement. - [BRAND Starbucks 2026 · Page: landing-campaign](https://memocore.ai/memos/6ab9efe7af51aac421da8b14.md) — Starbucks 2026 (starbucks.com/rewards, 2026-09): Rewards landing — warm cream hero, how it works, green/gold/black tier cards, star tabs, partner cards, app band, terms. - [BRAND Starbucks 2026 · Page: product-detail](https://memocore.ai/memos/6ab9efc0af51aac421da8b12.md) — Starbucks 2026 (starbucks.com/menu/product, 2026-09): drink page — House Green header with circular cup and white name, cup-icon size selector, Customize and Add to Order fraps, summary band. - [BRAND Starbucks 2026 · Page: category-listing](https://memocore.ai/memos/6ab9efa2af51aac421da8b10.md) — Starbucks 2026 (starbucks.com/menu, 2026-09): menu hub and category pages — sticky subnav, 150px side nav, circular category and product tiles, fixed House Green order crust. - [BRAND Starbucks 2026 · Page: home](https://memocore.ai/memos/6ab9ef82af51aac421da8b0e.md) — Starbucks 2026 (starbucks.com, 2026-09): home page — announcement strip, three alternating 50/50 photo + green panel promo blocks, five-column footer. - [BRAND Starbucks 2026 · Overview](https://memocore.ai/memos/6ab9ef63af51aac421da8b0c.md) — Starbucks 2026 (starbucks.com, 2026-09): site-wide design from its pattern library — greens #006241/#00754a/#1e3932, SoDo Sans, 50px pill buttons, frap, header, footer, motion. - [Brand Memo Templates](https://memocore.ai/memos/6ab4a353af51aac421da878f.md) — Fill-in templates for Overview, Page and Recipe brand memos, in reading order for a builder agent, with short filled examples. - [Media, Assets & Legal](https://memocore.ai/memos/6ab4a301af51aac421da8785.md) — How to describe imagery, icons, video and sound; brand assets; exact fonts with open alternatives; what a style-based rebuild may and may not copy. - [Rules](https://memocore.ai/memos/6ab4a25caf51aac421da8771.md) — The rules for brand memos: memo kinds and naming, what is mandatory, value formats, precision and evidence markers, guardrails, links, what never to store. - [Extraction Procedure & Screenshots](https://memocore.ai/memos/6ab4a33faf51aac421da878d.md) — Code-first procedure to analyze any website into brand memos: fetch and parse HTML, CSS and JS; browser only for screenshots and a surface check; captions, rebuild check. - [BRAND Airbnb 2026 · Overview](https://memocore.ai/memos/6ab67bb2af51aac421da88e9.md) — Airbnb 2026 (airbnb.com, 2026-09): site-wide design from its DLS tokens — #222222/#FF385C palette, Airbnb Cereal VF, 20px card radii, gradient pill CTA, spring motion, header, footer. - [BRAND Airbnb 2026 · Page: home](https://memocore.ai/memos/6ab67bdcaf51aac421da88eb.md) — Airbnb 2026 (airbnb.com, 2026-09): home page — 3D category tabs, big search pill, stacked shelves of homes, hotels, experiences and services, inspiration link grid, grey footer. - [BRAND Airbnb 2026 · Recipe: listing-shelf](https://memocore.ai/memos/6ab67b2baf51aac421da88e7.md) — Airbnb 2026 (airbnb.com, 2026-09): listing card shelves — exactly 7 cards per row at 1440, 20px image radius, frosted badge, heart, 28px paging arrows; photo carousel with dots on search cards. - [BRAND Airbnb 2026 · Recipe: search-bar](https://memocore.ai/memos/6ab67ae0af51aac421da88e3.md) — Airbnb 2026 (airbnb.com, 2026-09): header search bar — 66px three-segment pill, compact 46px pill on scroll, active segment on grey track, gradient Search button, dates panel. - [BRAND Airbnb 2026 · Page: search-results](https://memocore.ai/memos/6ab67c33af51aac421da88ef.md) — Airbnb 2026 (airbnb.com/s/..., 2026-09): search results — filter chip bar, 2-column list of 4:3 photo-carousel cards, 650px sticky map with price pins in a 20px frame, round pagination. - [BRAND Airbnb 2026 · Page: product-detail](https://memocore.ai/memos/6ab67c0faf51aac421da88ed.md) — Airbnb 2026 (airbnb.com/rooms/..., 2026-09): listing page — 5-photo gallery, 1120px column, sticky booking card with gradient CTA, highlights, amenities, 100px rating hero, reviews, map, host card. - [BRAND Airbnb 2026 · Recipe: category-tabs](https://memocore.ai/memos/6ab67b03af51aac421da88e5.md) — Airbnb 2026 (airbnb.com, 2026-09): All / Homes / Experiences / Services tabs with 3D-rendered icons and a sliding 3px underline; on mobile, raised and pressed pill chips. - [BRAND Nike 2026 · Recipe: filmstrip-carousel](https://memocore.ai/memos/6ab64810af51aac421da88c7.md) — Nike 2026 (nike.com, 2026-09): filmstrip carousel — native horizontal scroll-snap slider bleeding off the right edge, 435px/300px slides, 12px gap, round arrow buttons. - [BRAND Nike 2026 · Page: home](https://memocore.ai/memos/6ab648b7af51aac421da88cb.md) — Nike 2026 (nike.com, 2026-09): home page — full-bleed hero, campaign chapters with fade band and logo, video cards, filmstrips, caps text cards, product rails, trending grid. - [BRAND Nike 2026 · Overview](https://memocore.ai/memos/6ab6487daf51aac421da88c9.md) — Nike 2026 (nike.com, 2026-09): site-wide design from its Podium CDS tokens — black/white/grey palette, Nike Futura caps display, Helvetica Now text, pill buttons, header, footer, motion. - [BRAND Nike 2026 · Page: product-detail](https://memocore.ai/memos/6ab6490faf51aac421da88cf.md) — Nike 2026 (nike.com/t/..., 2026-09): product page — sticky thumbnail + image gallery, title/price, fit boxes, colorway chips, size grid, 60px pill Add to Bag, accordions. - [BRAND Nike 2026 · Page: category-listing](https://memocore.ai/memos/6ab648e7af51aac421da88cd.md) — Nike 2026 (nike.com/w/..., 2026-09): product listing — promo bar, sticky title with count, Hide Filters / Sort By, 240px filter sidebar, 3-column product cards. - [BRAND Nike 2026 · Recipe: nav-mega-menu](https://memocore.ai/memos/6ab647f3af51aac421da88c5.md) — Nike 2026 (nike.com, 2026-09): global header — 36px utility bar, 60px nav, hide-on-scroll peekaboo, hover mega-menu with 4 link columns, 320px mobile drawer. - [BRAND Stripe 2026 · Page: home](https://memocore.ai/memos/6ab62898af51aac421da88ae.md) — Stripe 2026 (stripe.com, 2026-09): home page — hero with wave and counter, logo marquee, bento, Sessions banner, stats band, business sizes, developers band, news, CTA, footer. - [BRAND Stripe 2026 · Overview](https://memocore.ai/memos/6ab62874af51aac421da88ac.md) — Stripe 2026 (stripe.com, 2026-09): site-wide design from its hds tokens — colors, Söhne 300 type scale, 12-col grid, 4px buttons, blue-tinted shadows, header, footer, motion. - [BRAND Stripe 2026 · Page: product-marketing](https://memocore.ai/memos/6ab61004af51aac421da886a.md) — Stripe 2026 (stripe.com/billing, 2026-09): product page — sub-nav, centered hero with wave and animated UI, logos, manifesto, bento, accordion, stats, stories, lists, FAQ, CTA. - [BRAND Stripe 2026 · Recipe: hero-wave](https://memocore.ai/memos/6ab4cfa6af51aac421da8803.md) — Stripe 2026 (stripe.com, 2026-09): hero gradient wave — placement, colors, grain, motion, fallbacks. - [BRAND Stripe 2026 · Recipe: bento-dialogs](https://memocore.ai/memos/6ab4cfc3af51aac421da8808.md) — Stripe 2026 (stripe.com, 2026-09): bento grid of product tiles with in-page dialogs — layout, tile style, dialog, motion. - [BRAND Stripe 2026 · Recipe: nav-mega-menu](https://memocore.ai/memos/6ab4cfb6af51aac421da8806.md) — Stripe 2026 (stripe.com, 2026-09): header and mega-menu — structure, measured header buttons, panel, motion, mobile menu. - [BRAND Apple 2026 · Page: home](https://memocore.ai/memos/6ab60f53af51aac421da8860.md) — Apple 2026 (apple.com, 2026-09): home page — ribbon, 3 full-bleed hero tiles, 6 promo tiles in 2 columns, two media galleries, footer; exact sizes per breakpoint. - [BRAND Apple 2026 · Recipe: card-gallery](https://memocore.ai/memos/6ab4b13baf51aac421da87e8.md) — Apple 2026 (apple.com, 2026-09): media and card galleries — slide sizes, dot pill navigation, autoplay, paddles, states. - [BRAND Apple 2026 · Recipe: globalnav-flyout](https://memocore.ai/memos/6ab4b127af51aac421da87e6.md) — Apple 2026 (apple.com, 2026-09): global nav flyout menu — structure, colors, blur, cascade timings, states. - [BRAND Apple 2026 · Page: product-family](https://memocore.ai/memos/6ab60f6daf51aac421da8862.md) — Apple 2026 (apple.com/iphone, 2026-09): product family hub — ribbon, headline, chapter nav, hero cards, lineup, incentives, feature cards, essentials, image accordion, link index. - [BRAND Apple 2026 · Overview](https://memocore.ai/memos/6ab4b169af51aac421da87ea.md) — Apple 2026 (apple.com, 2026-09): site-wide design — recognition keys, guardrails, tokens, SF Pro type scale, buttons, frosted nav, footer, layout, motion. - [README](https://memocore.ai/memos/6ab4a38caf51aac421da8795.md) — Start here: what the Brand Styles system is, the 9 system memos, how to build a page in a brand's style, and how to analyze and save any website. - [Legacy Web (1990-2009)](https://memocore.ai/memos/6ab4a32faf51aac421da878b.md) — Add-on for designs before about 2010: canvas sizes, framesets, tables, spacer GIFs, image maps, web-safe colors, font tags, old widgets, Flash, browser quirks. - [CJK & RTL Typography](https://memocore.ai/memos/6ab4a320af51aac421da8789.md) — Add-on for sites with Japanese, Chinese, Korean, Arabic or Hebrew text: font stacks, CJK metrics, line breaking, vertical text, density, RTL mirroring, localized sites. - [Components, Motion & Recipes](https://memocore.ai/memos/6ab4a2c2af51aac421da877d.md) — What to record for components and their states, the interaction record for any animation, required numbers per component type, scroll effects, 3D scenes, cursors, preloaders. - [Vocabularies](https://memocore.ai/memos/6ab4a2a2af51aac421da8779.md) — Shared names for page types (with fallbacks and typical sections), section types and variants, and style tags by era. ## Search this catalog `GET https://memocore.ai/api/projects/explore?query=&limit=` — public, no authentication.