Visual category selector on Fonts, plus a grid breakpoint fix
0.1The Fonts category filter is now visual: a row of tiles above the cards, each showing a big 'Aa' in a font representative of that style (Playfair Display for Serif, Space Grotesk for Sans, Anton for Display, Space Mono for Mono, Pacifico for Script; All in the UI sans). The selected tile inverts to dark-on-light.
0.2The search box moved to the far right and gained a magnifying-glass icon; the old text pills are gone.
0.3Fixed a layout gap: between roughly 640 and 784px the grid showed a single narrow card stranded in the middle. It now stays a full-width single card until two cards genuinely fit.
0.4The Colors page now opens on the Swatches view by default.
Key files
app/components/CategoryTiles.tsx — the Aa specimen tiles (representative fonts in a single TILES constant)
app/components/BrowseView.tsx — search moved right + icon, pills replaced by CategoryTiles
app/components/ui/Grid.tsx — switch to 22rem columns at min-[49rem] (when two fit), not sm
app/components/ColorsView.tsx — default to the Swatches view
Pairing cards: paragraph support, always-on fonts, and pivot to a partner
1.1Pairing cards now include the paragraph too (in the text font) when you turn paragraph on in the gear — so the visibility setting reaches pairings, not just single fonts.
1.2A pairing always shows both of its fonts: the title and subtitle stay visible on pairing cards no matter your hide settings, since hiding one would hide half the pairing. Only the paragraph is optional there.
1.3Click the partner font's name in a pairing's footer to open its own pairings in a new tab — so you can branch off to explore it without losing your place. The font you're already viewing isn't a link; on the home and favorites cards both names link.
Key files
app/components/PairingCard.tsx — paragraph passthrough, pairing flag, partner-name links (new tab)
app/components/SpecimenCard.tsx — `pairing` forces title+subtitle visible; only paragraph follows visibility
app/components/PairingsView.tsx — passes the source font so only the partner links
app/components/SuggestedPairings.tsx + FavoritesView.tsx — paragraph override threaded through
Customizable page-chrome colors, and the card-theme toggle in the gear
4.1You can now recolor the whole app's chrome — the shell behind the cards, the nav and footer, and the active-control highlight. The Colors page has a swatch editor under Page chrome with a color picker per role and a Restore defaults button; changes apply site-wide instantly and persist.
4.2The Randomize / Use selected theme switch is now also in the gear menu (it has an app-wide effect, so it's reachable from anywhere). The gear and the Colors page share one setting and stay in sync; pick which theme on the Colors page.
4.3Page-chrome colors now flow through CSS variables, so a single edit repaints the entire shell at once. Defaults are unchanged — nothing looks different until you customize.
Key files
lib/card-themes.ts — PAGE_THEME/HIGHLIGHT now reference --page-* CSS vars; literals kept as *_DEFAULT + PAGE_CHROME_DEFAULTS for the editor
app/globals.css — --page-bg/-fg/-muted/-accent/-highlight defaults; body grounds on --page-bg
app/components/CardThemeProvider.tsx — per-role page-chrome overrides written to the document root and persisted
app/components/ColorsView.tsx — PageChromeEditor (color picker per role + Restore defaults)
app/components/TypographicVoiceModal.tsx — Card color (Randomize / Use selected theme) section in the gear
Colors page: preview, swatch view, and a pick-a-theme-for-everything setting
5.1Added a Colors page (in the nav) that shows every card color theme. It opens as a split panel like the pairings page: a sample font card on the left, the themes on the right — click a theme and it paints onto the sample.
5.2A Preview / Swatches toggle flips the theme cards between full sample cards and tight square-swatch strips for scanning the palette at a glance.
5.3You can now pick one theme and apply it to every card across the whole app. A Randomize / Use selected theme toggle under the sample card decides whether cards cycle through all themes (the default) or all use your chosen one.
5.4Your chosen theme now persists — it survives a refresh and is remembered across the app, instead of resetting each visit.
5.5The page also shows the fixed page-chrome colors (the shell behind the grid and the active-control highlight).
Split-panel pairings page and scroll memory on the way back
6.1Redesigned the per-font pairings page: the font you picked now sits on its own to the left as a full specimen, with its partners laid out in their own grid to the right — so the pairing relationship reads at a glance.
6.2The selected font stays put (sticky) as you scroll its partners, keeping the comparison anchored.
6.3Gave the pairings page room to breathe — it now spreads to the full width of the window so more partners show at once, instead of the four-across measure the rest of the app uses.
6.4Returning from a pairings page now drops you right back where you were on the Fonts grid — your search, category, how many fonts you'd loaded, and your scroll position are all remembered, instead of resetting to the top.
Key files
app/components/PairingsView.tsx — two-column split layout, sticky source card, scroll-to-top on open
app/pairings/[slug]/page.tsx — full-bleed page, back-caret gutter guard, scroll={false} on the back link
app/components/BrowseView.tsx — per-tab snapshot restores filters, loaded count, and scroll on return
app/components/FontSpecimenCard.tsx — Get Pairings link opts out of scroll-to-top so the browse position survives
Bookmarkable pairings, a Fonts-first nav, and backlog status
7.1Opening a font's pairings now changes the URL instead of a pop-up, so any pairing can be bookmarked and shared — every font has its own /pairings/{font} page.
7.2Renamed and reordered the nav: the font browser is now the home page under "Fonts", the old home page of suggested pairings moved under "Pairings", and Favorites is unchanged.
7.3Cleaned up the pairings page — one "Pairings for {Font}" heading lined up with the cards, all pairings shown as a single set, and a round back button tucked into the left margin opposite the voice gear.
7.4Gave the backlog an open/closed view: two pills toggle between active ideas and shipped ones, with closed items set apart in blue.
7.5Marked "Bookmarkable pairing routes" as shipped — the first closed backlog item.
Key files
app/pairings/[slug]/page.tsx — per-font pairings page (SSG, one per font)
app/pairings/page.tsx — the suggested-pairings showcase (was the home page)
app/page.tsx — root is now the Fonts browser; /explorer redirects here
app/components/PairingsView.tsx — shared pairings grid (replaced the modal)
lib/slug.ts — font-name <-> URL-slug, the single source of truth
app/backlog/BacklogList.tsx — Open/Closed pills and the closed (blue) card theme
Unified page header, neutral palette, and a footer
8.1Unified every view's header into one element — the title sits in the same place and style on Home, Explorer, Favorites, and Changelog; the eyebrow and descriptive sub-text were dropped for a cleaner read.
8.2Folded the Explorer search and category filters into that shared header, and removed the sort options — results default to most popular.
8.3Made page headers line up with the cards at every width, and the changelog header line up with its narrower card column.
8.4Repainted the whole site in a neutral near-black, with the nav blending into the page.
8.5Settled on a single amber highlight for active controls (filter pills, the voice gear), keeping the red as a small accent.
8.6Added a global footer with the license and a GitHub link — it sits below the content, or at the bottom of short pages.
8.7Gave the light voice pop-up bold labels and trimmed its heading.
Key files
app/components/ui/PageHeader.tsx — the one shared page header
app/components/ui/GridAlign.tsx — pins headers to the centered card block
app/components/Footer.tsx + app/layout.tsx — the global footer and sticky-footer layout
app/components/BrowseView.tsx — Explorer in the unified layout (filters in header, no sort)
lib/card-themes.ts — neutral PAGE_THEME background + the HIGHLIGHT accent
Global typographic voice, unified cards, and this changelog
9.1Made the typographic voice global: one editor pop-up, opened from a gear at the right of the nav, now drives Explorer specimens, Home and favorite pairings alike — replacing the two separate editors that had drifted apart.
9.2Reworked that editor into a light-mode pop-up with stacked, auto-growing fields, reachable from any page and any scroll depth.
9.3Unified every card surface (Explorer, Home, pairings, favorites) onto one card component and one grid — a single fluid column on small screens, then fixed-width cards instead of stretching.
9.4Added this changelog at /changelog — a card per dated entry — plus the /changes command and README notes for keeping it current.
Key files
app/components/VoiceProvider.tsx — global voice state + the single editor pop-up
app/components/SpecimenCard.tsx — the shared card; FontSpecimenCard / PairingCard wrap it
app/components/ChangelogCard.tsx + app/changelog/page.tsx — the changelog surface
app/globals.css — the theme-light inverted-surface convention