npm - @nurix/etna - Versions diffs - 0.19.2 → 0.19.4 - Mend

@nurix/etna 0.19.2 → 0.19.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (122) hide show

package/data/harnesses/code/skills/design/data/combinations/typography.csv CHANGED Viewed

@@ -1,61 +1,64 @@
-id,pairing,tier,heading_family,body_family,mono_family,contrast,mood,best_for,heading_weights,body_weights,google_fonts_css,notes
-1,Minimal Swiss,operator-active,Inter,Inter,JetBrains Mono,sans+sans,"minimal, neutral, functional, legible, systematic","dashboards, admin panels, data tables, design systems, internal tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap,"One neutral grotesque carries the whole hierarchy through weight alone, which is the safest default for a dense operator console."
-2,Friendly SaaS,operator-active,Plus Jakarta Sans,Plus Jakarta Sans,JetBrains Mono,sans+sans,"approachable, modern, warm, professional, versatile","SaaS consoles, B2B web apps, settings pages, productivity tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap,Plus Jakarta Sans keeps a single-family setup readable while adding a touch more warmth than Inter for softer product surfaces.
-3,Financial Trust,operator-active,IBM Plex Sans,IBM Plex Sans,IBM Plex Mono,sans+sans,"trustworthy, corporate, precise, serious, tabular","banking back-office, fintech admin, ledgers, reporting, enterprise apps",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,"IBM Plex Sans reads calmly at small sizes and pairs cleanly with its own mono for figure columns, so numbers and labels feel of one voice."
-4,Modern Neutral,operator-active,Manrope,Manrope,JetBrains Mono,sans+sans,"clean, contemporary, premium, balanced, quiet","product dashboards, analytics UIs, marketing-adjacent consoles, portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap,"Manrope splits the difference between geometric and humanist, giving a crisp yet friendly single-family system for polished internal products."
-5,Premium Sans,operator-active,DM Sans,DM Sans,Space Mono,sans+sans,"premium, tidy, geometric, understated, modern","startup consoles, low-chrome apps, forms, focused single-column tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap,"DM Sans stays compact and even in color, so long forms and settings screens hold together without a second family."
-6,Source Workhorse,operator-active,Source Sans 3,Source Sans 3,Source Code Pro,sans+sans,"utilitarian, readable, open-source, dependable, plain","documentation UIs, content admins, help centers, ticketing back-ends",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700&display=swap,Source Sans 3 is an unfussy reading sans that scales from field labels to paragraph help text within one file.
-7,Material Console,operator-active,Roboto,Roboto,Roboto Mono,sans+sans,"familiar, android, systematic, adaptive, plain","Android-adjacent tools, cross-platform admin, MD3 apps, embedded dashboards",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap,"Roboto is the Material default operators already recognize, and pairing it with Roboto Mono keeps data cells in the same family."
-8,Accessibility First,operator-active,Atkinson Hyperlegible,Atkinson Hyperlegible,IBM Plex Mono,sans+sans,"accessible, legible, inclusive, high-clarity, plain","accessibility-critical tools, healthcare, government back-office, inclusive design",700,400;700,https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&display=swap,"Atkinson Hyperlegible pulls apart easily confused letterforms, which matters when operators scan identifiers and codes all day."
-9,Modern Professional,operator-active,Poppins,Open Sans,JetBrains Mono,sans+sans,"professional, friendly, corporate, clean, approachable","corporate apps, business dashboards, professional services, portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&family=Open+Sans:wght@400;500;600;700&display=swap,Geometric Poppins headings sit above humanist Open Sans body so section titles get presence without hurting long-run readability.
-10,Tech Startup,operator-active,Space Grotesk,DM Sans,JetBrains Mono,sans+sans,"technical, modern, distinctive, product, confident","developer products, technical dashboards, SaaS consoles, data tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap,Space Grotesk lends headings a little engineered character while DM Sans keeps the body plain and dense-friendly.
-11,Geometric Modern,operator-active,Outfit,Work Sans,JetBrains Mono,sans+sans,"geometric, contemporary, balanced, versatile, clean","general admin, internal portals, catalog tools, landing-adjacent consoles",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700&family=Work+Sans:wght@400;500;600;700&display=swap,"Outfit gives crisp geometric headings and Work Sans supplies a slightly warmer, workmanlike body underneath."
-12,Corporate Trust,operator-active,Lexend,Source Sans 3,IBM Plex Mono,sans+sans,"readable, accessible, corporate, calm, dependable","enterprise apps, finance, healthcare, accessibility-focused back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lexend:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Lexend was tuned to ease reading speed, so it earns the heading role over a plain Source Sans 3 body in text-heavy consoles."
-13,Medical Clean,operator-active,Figtree,Noto Sans,IBM Plex Mono,sans+sans,"clean, clinical, accessible, calm, professional","healthcare admin, clinical tools, records systems, patient portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Figtree:wght@500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap,Figtree stays neutral and clear for headings while Noto Sans covers the wide glyph range clinical data tends to demand.
-14,Commerce Clean,operator-active,Rubik,Nunito Sans,JetBrains Mono,sans+sans,"friendly, retail, clean, approachable, orderly","back-office commerce, order management, catalog admin, fulfillment tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Rubik:wght@500;600;700&family=Nunito+Sans:wght@400;500;600;700&display=swap,Rubik's rounded corners give order screens a little friendliness while Nunito Sans keeps line items quietly legible.
-15,Minimalist Portfolio,operator-active,Space Grotesk,Archivo,Space Mono,sans+sans,"minimal, editorial, crisp, design-forward, restrained","design tooling, asset managers, internal editors, review consoles",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Archivo:wght@400;500;600;700&display=swap,Space Grotesk headings stay distinctive against Archivo's tighter grotesque body for tools that want a designed feel.
-16,Government Public,operator-active,Public Sans,Source Sans 3,IBM Plex Mono,sans+sans,"civic, neutral, accessible, plain, official","government dashboards, public-sector admin, compliance tools, records",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Public+Sans:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Public Sans carries a civic, standards-driven tone for headings that Source Sans 3 supports without drawing attention."
-17,Technical Data,operator-active,Exo,IBM Plex Sans,Roboto Mono,sans+sans,"technical, engineered, precise, data, modern","engineering dashboards, monitoring, telemetry consoles, ops tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Exo:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,Exo adds a subtle engineered edge to headings while IBM Plex Sans keeps dense telemetry labels grounded and readable.
-18,Condensed Dense,operator-active,Barlow Condensed,Barlow,JetBrains Mono,sans+sans,"condensed, dense, efficient, compact, utilitarian","space-tight dashboards, dense tables, control panels, logistics tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Barlow:wght@400;500;600;700&display=swap,Barlow Condensed packs long headings into narrow columns and shares a family with Barlow body so the two never clash.
-19,Developer Mono,operator-active,JetBrains Mono,IBM Plex Sans,JetBrains Mono,mono+sans,"developer, technical, precise, code, functional","developer tools, CI dashboards, config editors, log viewers",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,JetBrains Mono headings and labels signal a code context while IBM Plex Sans keeps surrounding prose comfortable to read.
-20,Dashboard Data,operator-active,Fira Code,Fira Sans,Fira Code,mono+sans,"analytics, technical, data, precise, cohesive","analytics dashboards, metric consoles, query tools, observability",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Fira+Code:wght@500;600;700&family=Fira+Sans:wght@400;500;600;700&display=swap,"The Fira family shares proportions across mono and sans, so figures in Fira Code sit naturally beside Fira Sans labels."
-21,Academic Research,operator-active,Crimson Pro,Atkinson Hyperlegible,IBM Plex Mono,serif+sans,"scholarly, readable, accessible, considered, literate","research admin, academic tools, knowledge bases, review systems",500;600;700,400;700,https://fonts.googleapis.com/css2?family=Crimson+Pro:wght@500;600;700&family=Atkinson+Hyperlegible:wght@400;700&display=swap,Crimson Pro gives headings a scholarly serif voice while Atkinson Hyperlegible keeps the body maximally clear for long reading.
-22,News Editorial,operator-active,Newsreader,Roboto,Roboto Mono,serif+sans,"editorial, journalistic, readable, trustworthy, content-rich","content moderation, CMS back-ends, editorial dashboards, review queues",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Newsreader:wght@500;600;700&family=Roboto:wght@400;500;600;700&display=swap,"Newsreader is a text serif rather than a display face, so it heads content-heavy screens without tiring the reader, over a Roboto body."
-23,Legal Records,operator-active,EB Garamond,Lato,IBM Plex Mono,serif+sans,"formal, authoritative, records, considered, traditional","legal ops tools, contract admin, records systems, compliance consoles",500;600;700,400;700,https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500;600;700&family=Lato:wght@400;700&display=swap,"EB Garamond lends record screens a formal, document-like authority in headings that Lato keeps plainly readable in the body."
-24,Vietnamese Locale,operator-active,Be Vietnam Pro,Noto Sans,JetBrains Mono,sans+sans,"multilingual, vietnamese, readable, clean, localized","Vietnamese-market tools, multilingual admin, localized back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap,Be Vietnam Pro handles full Vietnamese diacritics cleanly with Noto Sans as a broad fallback for mixed-script data.
-25,Japanese Locale,operator-active,Noto Serif JP,Noto Sans JP,JetBrains Mono,serif+sans,"japanese, multilingual, legible, localized, considered","Japanese-market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap,Noto Serif JP heads Japanese screens with a settled tone while Noto Sans JP keeps dense kana and kanji body text even.
-26,Korean Locale,operator-active,Noto Sans KR,Noto Sans KR,JetBrains Mono,sans+sans,"korean, multilingual, clean, localized, readable","Korean-market tools, localized admin, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700&display=swap,A single Noto Sans KR system keeps Hangul hierarchy consistent across headings and body without a second face to tune.
-27,Chinese Simplified Locale,operator-active,Noto Sans SC,Noto Sans SC,JetBrains Mono,sans+sans,"chinese, simplified, multilingual, clean, localized","mainland-market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&display=swap,"Noto Sans SC gives simplified-Chinese operators a full, even glyph set from labels to paragraphs in one family."
-28,Arabic Locale,operator-active,Noto Naskh Arabic,Noto Sans Arabic,JetBrains Mono,serif+sans,"arabic, rtl, multilingual, localized, readable","Arabic-market admin, RTL dashboards, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@500;600;700&family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap,Noto Naskh Arabic heads RTL screens with a traditional voice while Noto Sans Arabic keeps body and UI text modern and clear.
-29,Hebrew Locale,operator-active,Noto Sans Hebrew,Noto Sans Hebrew,JetBrains Mono,sans+sans,"hebrew, rtl, multilingual, localized, clean","Hebrew-market tools, RTL admin, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+Hebrew:wght@400;500;600;700&display=swap,One Noto Sans Hebrew system keeps RTL hierarchy consistent and legible for Israeli-market internal tools.
-30,Thai Locale,operator-active,Noto Sans Thai,Noto Sans Thai,JetBrains Mono,sans+sans,"thai, multilingual, readable, localized, clean","Thai-market admin, localized consoles, SEA back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap,"Noto Sans Thai renders looped Thai script clearly at UI sizes, carrying both heading and body in one dependable family."
-31,Chinese Traditional Locale,operator-active,Noto Serif TC,Noto Sans TC,JetBrains Mono,serif+sans,"chinese, traditional, multilingual, localized, considered","Taiwan and Hong Kong market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap,Noto Serif TC gives traditional-Chinese headings a measured tone with Noto Sans TC handling denser body text.
-32,Rounded Legible,operator-active,Nunito Sans,Nunito Sans,JetBrains Mono,sans+sans,"rounded, friendly, legible, calm, approachable","support consoles, CRM back-office, help desks, customer-facing admin",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700&display=swap,Nunito Sans softens a support console's tone with gently rounded terminals while staying legible enough for all-day use.
-33,Grotesque Utility,operator-active,Karla,Karla,Space Mono,sans+sans,"grotesque, utilitarian, compact, plain, efficient","utility dashboards, config panels, small-footprint tools, forms",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Karla:wght@400;500;600;700&display=swap,"Karla is a tidy grotesque whose narrow set width fits more label text per row, useful when screen real estate is tight."
-34,Classic Elegant,dormant-marketing,Playfair Display,Inter,JetBrains Mono,serif+sans,"elegant, luxury, editorial, high-contrast, premium","luxury brands, fashion, editorial, high-end marketing sites",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap,"Playfair Display's sharp contrast makes an elegant hero serif over an Inter body, a look aimed at premium marketing rather than dense tools."
-35,Editorial Classic,dormant-marketing,Cormorant Garamond,Libre Baskerville,IBM Plex Mono,serif+serif,"editorial, literary, traditional, refined, bookish","publishing, literary magazines, long-form editorial, book sites",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Libre+Baskerville:wght@400;500;600;700&display=swap,"An all-serif pairing leans fully literary, which suits editorial publishing but is too low-contrast for scanning operator data."
-36,Playful Creative,dormant-marketing,Fredoka,Nunito,Space Mono,display+sans,"playful, friendly, fun, rounded, warm","children's products, education marketing, games, lighthearted brands",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Nunito:wght@400;500;600;700&display=swap,Rounded Fredoka headings set a distinctly playful tone better suited to consumer marketing than to a working console.
-37,Bold Statement,dormant-marketing,Bebas Neue,Source Sans 3,JetBrains Mono,display+sans,"bold, impactful, headline, dramatic, loud","marketing heroes, event pages, agencies, campaign landing",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Bebas+Neue:wght@400&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Bebas Neue is an all-caps display face for oversized headlines only, which is why it lives in the marketing pack, not the operator set."
-38,Wellness Calm,dormant-marketing,Lora,Raleway,IBM Plex Mono,serif+sans,"calm, wellness, organic, gentle, natural","wellness brands, spa, meditation, lifestyle marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lora:wght@500;600;700&family=Raleway:wght@400;500;600;700&display=swap,"Lora and thin Raleway create a soft, unhurried marketing mood that trades the crisp legibility a data tool needs."
-39,Retro Vintage,dormant-marketing,Abril Fatface,Merriweather,Space Mono,serif+serif,"retro, vintage, dramatic, decorative, nostalgic","vintage brands, breweries, restaurants, poster-style marketing",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Abril+Fatface:wght@400&family=Merriweather:wght@400;500;600;700&display=swap,"Abril Fatface's heavy Didone hairlines make a striking vintage hero serif reserved for headlines, paired with Merriweather body."
-40,Luxury Serif,dormant-marketing,Cormorant,Montserrat,IBM Plex Mono,serif+sans,"luxury, fashion, refined, premium, high-end","fashion houses, jewelry, luxury e-commerce, premium services",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cormorant:wght@500;600;700&family=Montserrat:wght@400;500;600;700&display=swap,Cormorant's delicate high-contrast forms read as luxury marketing and would wash out in the small sizes operator tables use.
-41,Handwritten Charm,dormant-marketing,Caveat,Quicksand,Space Mono,display+sans,"handwritten, personal, casual, warm, charming","personal brands, invitations, lifestyle marketing, creative portfolios",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Quicksand:wght@400;500;600;700&display=swap,"Caveat is a script accent for personality-driven marketing, unusable as working type but kept for the campaign pack."
-42,Fashion Forward,dormant-marketing,Syne,Manrope,JetBrains Mono,sans+sans,"avant-garde, artistic, edgy, creative, bold","fashion labels, art galleries, creative agencies, design studios",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Syne:wght@500;600;700&family=Manrope:wght@400;500;600;700&display=swap,Syne's quirky letterforms give fashion and gallery sites an art-directed edge that is deliberately too loud for utilitarian screens.
-43,Soft Rounded,dormant-marketing,Varela Round,Nunito Sans,JetBrains Mono,sans+sans,"soft, rounded, friendly, gentle, warm","kids and pet brands, wellness marketing, soft consumer UI",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Varela+Round:wght@400&family=Nunito+Sans:wght@400;500;600;700&display=swap,Fully rounded Varela Round headings set a soft consumer mood aimed at friendly marketing rather than dense operator work.
-44,Magazine Style,dormant-marketing,Libre Bodoni,Public Sans,IBM Plex Mono,serif+sans,"magazine, editorial, print, refined, journalistic","online magazines, editorial features, publishing marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Libre+Bodoni:wght@500;600;700&family=Public+Sans:wght@400;500;600;700&display=swap,Libre Bodoni's print-magazine contrast makes expressive feature headings that suit publishing marketing over back-office reading.
-45,Cyberpunk Web3,dormant-marketing,Orbitron,Exo 2,JetBrains Mono,display+sans,"futuristic, crypto, neon, sci-fi, technical","crypto and web3 marketing, NFT sites, gaming, futuristic brands",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700&family=Exo+2:wght@400;500;600;700&display=swap,"Orbitron's wide sci-fi caps brand crypto and gaming marketing pages, a decorative look kept clear of real data screens."
-46,Gaming Bold,dormant-marketing,Russo One,Chakra Petch,Space Mono,display+sans,"gaming, bold, esports, energetic, competitive","gaming and esports marketing, tournaments, entertainment brands",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Russo+One:wght@400&family=Chakra+Petch:wght@400;500;600;700&display=swap,"Russo One's blocky impact suits esports headlines while Chakra Petch adds a techy body, a pairing tuned for hype not throughput."
-47,Real Estate Luxury,dormant-marketing,Cinzel,Josefin Sans,IBM Plex Mono,serif+sans,"luxury, architectural, refined, premium, elegant","luxury real estate, architecture, interiors, premium property marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Josefin+Sans:wght@400;500;600;700&display=swap,"Cinzel's engraved Roman capitals evoke premium property branding, a display serif meant for hero titles rather than dense listings."
-48,Luxury Minimalist,dormant-marketing,Bodoni Moda,Jost,IBM Plex Mono,serif+sans,"luxury, minimalist, high-contrast, refined, premium","high-end fashion, premium minimal brands, luxury product marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@500;600;700&family=Jost:wght@400;500;600;700&display=swap,"Bodoni Moda's extreme contrast reads as minimalist luxury in headlines, paired with geometric Jost, and stays in the marketing pack."
-49,Neubrutalist Bold,dormant-marketing,Lexend Mega,Public Sans,JetBrains Mono,display+sans,"neubrutalist, loud, geometric, bold, quirky","neubrutalist marketing, Gen Z brands, bold campaign pages",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lexend+Mega:wght@500;600;700&family=Public+Sans:wght@400;500;600;700&display=swap,"Lexend Mega's ultra-wide tracking is a deliberately loud neubrutalist statement for campaigns, not a workaday heading face."
-50,Gen Z Brutal,dormant-marketing,Anton,Epilogue,JetBrains Mono,display+sans,"brutal, loud, streetwear, meme, bold","streetwear, viral campaigns, Gen Z marketing, sticker packs",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Anton:wght@400&family=Epilogue:wght@400;500;600;700&display=swap,"Anton's condensed black weight shouts for streetwear and meme campaigns, an intentionally aggressive display voice kept dormant."
-51,Bauhaus Geometric,dormant-marketing,Outfit,Outfit,JetBrains Mono,sans+sans,"bauhaus, geometric, constructivist, poster, architectural","design-forward brand marketing, art and culture, poster-style sites",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap,"A single Outfit set at heavy uppercase weights makes a Bauhaus poster system that is expressive branding, not operator hierarchy."
-52,Monochrome Editorial,dormant-marketing,Playfair Display,Source Serif 4,JetBrains Mono,serif+serif,"monochrome, editorial, austere, high-contrast, typographic","luxury fashion editorial, digital exhibitions, portfolio marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Source+Serif+4:wght@400;500;600;700&display=swap,"Playfair Display over Source Serif 4 makes an austere all-serif editorial statement built for display, not for scanning records."
-53,Kinetic Brutalism,dormant-marketing,Space Grotesk,Space Grotesk,Space Mono,sans+sans,"kinetic, brutalist, oversized, street, high-energy","music and culture marketing, sports brands, flagship campaign pages",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap,"Pushed to oversized uppercase weights, a single Space Grotesk becomes a high-energy brutalist system tuned for motion-heavy marketing."
-54,SaaS Boutique,dormant-marketing,Calistoga,Inter,JetBrains Mono,serif+sans,"boutique, warm, editorial, bold, characterful","boutique SaaS marketing, brand landing pages, campaign heroes",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Calistoga:wght@400&family=Inter:wght@400;500;600;700&display=swap,"Calistoga's warm display serif gives marketing heroes personality over an Inter body, a look for landing pages rather than the app itself."
-55,Terminal CLI,dormant-marketing,JetBrains Mono,IBM Plex Sans,JetBrains Mono,mono+sans,"terminal, hacker, retro-future, technical, aesthetic","hacker-aesthetic marketing, web3 landing, security-brand campaigns",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,An all-mono terminal aesthetic reads as a stylistic hacker brand for marketing; the sans body keeps it from becoming unreadable at length.
-56,Art Deco,dormant-marketing,Poiret One,Didact Gothic,JetBrains Mono,display+sans,"art-deco, vintage, 1920s, decorative, elegant","art-deco event marketing, luxury hotels, period-themed brands",400,400,https://fonts.googleapis.com/css2?family=Poiret+One:wght@400&family=Didact+Gothic:wght@400&display=swap,"Poiret One's thin geometric Deco lines evoke the 1920s for themed marketing, a decorative heading unfit for functional density."
-57,Restaurant Menu,dormant-marketing,Playfair Display SC,Karla,IBM Plex Mono,serif+sans,"culinary, hospitality, elegant, menu, refined","restaurant and cafe marketing, food brands, hospitality sites",700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display+SC:wght@700&family=Karla:wght@400;500;600;700&display=swap,"Small-caps Playfair sets refined menu headers over a plain Karla body, a hospitality-marketing look rather than an operator surface."
-58,Kids Education,dormant-marketing,Baloo 2,Nunito,Space Mono,display+sans,"playful, education, colorful, friendly, learning","children's education marketing, kids apps, learning brands",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700&family=Nunito:wght@400;500;600;700&display=swap,"Chunky rounded Baloo 2 headings signal a kid-friendly product for education marketing, with Nunito supplying a legible playful body."
-59,Indie Craft,dormant-marketing,Amatic SC,Cabin,JetBrains Mono,display+sans,"indie, craft, handmade, artisan, organic","craft and artisan marketing, handmade goods, indie brands",700,400;500;600;700,https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&family=Cabin:wght@400;500;600;700&display=swap,"Amatic SC's thin hand-drawn caps give artisan marketing a handmade feel, a decorative accent paired with a steady Cabin body."
-60,Music Entertainment,dormant-marketing,Righteous,Poppins,Space Mono,display+sans,"music, entertainment, energetic, bold, festive","music and event marketing, festivals, entertainment brands",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Righteous:wght@400&family=Poppins:wght@400;500;600;700&display=swap,"Righteous's rounded retro display suits music and festival headlines, an energetic marketing voice over a Poppins body."
+id,pairing,tier,heading_family,body_family,mono_family,contrast,mood,best_for,heading_weights,body_weights,google_fonts_css,notes,css-import,tailwind-config,display-size-hint
+1,Minimal Swiss,operator-active,Inter,Inter,JetBrains Mono,sans+sans,"minimal, neutral, functional, legible, systematic","dashboards, admin panels, data tables, design systems, internal tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap,"One neutral grotesque carries the whole hierarchy through weight alone, which is the safest default for a dense operator console.",@import '@fontsource/inter/400.css'; @import '@fontsource/inter/500.css'; @import '@fontsource/inter/600.css'; @import '@fontsource/inter/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Inter', 'sans-serif'], body: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+2,Friendly SaaS,operator-active,Plus Jakarta Sans,Plus Jakarta Sans,JetBrains Mono,sans+sans,"approachable, modern, warm, professional, versatile","SaaS consoles, B2B web apps, settings pages, productivity tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap,Plus Jakarta Sans keeps a single-family setup readable while adding a touch more warmth than Inter for softer product surfaces.,@import '@fontsource/plus-jakarta-sans/400.css'; @import '@fontsource/plus-jakarta-sans/500.css'; @import '@fontsource/plus-jakarta-sans/600.css'; @import '@fontsource/plus-jakarta-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Plus Jakarta Sans', 'sans-serif'], body: ['Plus Jakarta Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+3,Financial Trust,operator-active,IBM Plex Sans,IBM Plex Sans,IBM Plex Mono,sans+sans,"trustworthy, corporate, precise, serious, tabular","banking back-office, fintech admin, ledgers, reporting, enterprise apps",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,"IBM Plex Sans reads calmly at small sizes and pairs cleanly with its own mono for figure columns, so numbers and labels feel of one voice.",@import '@fontsource/ibm-plex-sans/400.css'; @import '@fontsource/ibm-plex-sans/500.css'; @import '@fontsource/ibm-plex-sans/600.css'; @import '@fontsource/ibm-plex-sans/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['IBM Plex Sans', 'sans-serif'], body: ['IBM Plex Sans', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+4,Modern Neutral,operator-active,Manrope,Manrope,JetBrains Mono,sans+sans,"clean, contemporary, premium, balanced, quiet","product dashboards, analytics UIs, marketing-adjacent consoles, portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap,"Manrope splits the difference between geometric and humanist, giving a crisp yet friendly single-family system for polished internal products.",@import '@fontsource/manrope/400.css'; @import '@fontsource/manrope/500.css'; @import '@fontsource/manrope/600.css'; @import '@fontsource/manrope/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Manrope', 'sans-serif'], body: ['Manrope', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+5,Premium Sans,operator-active,DM Sans,DM Sans,Space Mono,sans+sans,"premium, tidy, geometric, understated, modern","startup consoles, low-chrome apps, forms, focused single-column tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap,"DM Sans stays compact and even in color, so long forms and settings screens hold together without a second family.",@import '@fontsource/dm-sans/400.css'; @import '@fontsource/dm-sans/500.css'; @import '@fontsource/dm-sans/600.css'; @import '@fontsource/dm-sans/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['DM Sans', 'sans-serif'], body: ['DM Sans', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+6,Source Workhorse,operator-active,Source Sans 3,Source Sans 3,Source Code Pro,sans+sans,"utilitarian, readable, open-source, dependable, plain","documentation UIs, content admins, help centers, ticketing back-ends",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700&display=swap,Source Sans 3 is an unfussy reading sans that scales from field labels to paragraph help text within one file.,@import '@fontsource/source-sans-3/400.css'; @import '@fontsource/source-sans-3/500.css'; @import '@fontsource/source-sans-3/600.css'; @import '@fontsource/source-sans-3/700.css'; @import '@fontsource/source-code-pro/400.css'; @import '@fontsource/source-code-pro/500.css';,"fontFamily: { heading: ['Source Sans 3', 'sans-serif'], body: ['Source Sans 3', 'sans-serif'], mono: ['Source Code Pro', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+7,Material Console,operator-active,Roboto,Roboto,Roboto Mono,sans+sans,"familiar, android, systematic, adaptive, plain","Android-adjacent tools, cross-platform admin, MD3 apps, embedded dashboards",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap,"Roboto is the Material default operators already recognize, and pairing it with Roboto Mono keeps data cells in the same family.",@import '@fontsource/roboto/400.css'; @import '@fontsource/roboto/500.css'; @import '@fontsource/roboto/600.css'; @import '@fontsource/roboto/700.css'; @import '@fontsource/roboto-mono/400.css'; @import '@fontsource/roboto-mono/500.css';,"fontFamily: { heading: ['Roboto', 'sans-serif'], body: ['Roboto', 'sans-serif'], mono: ['Roboto Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+8,Accessibility First,operator-active,Atkinson Hyperlegible,Atkinson Hyperlegible,IBM Plex Mono,sans+sans,"accessible, legible, inclusive, high-clarity, plain","accessibility-critical tools, healthcare, government back-office, inclusive design",700,400;700,https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&display=swap,"Atkinson Hyperlegible pulls apart easily confused letterforms, which matters when operators scan identifiers and codes all day.",@import '@fontsource/atkinson-hyperlegible/400.css'; @import '@fontsource/atkinson-hyperlegible/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Atkinson Hyperlegible', 'sans-serif'], body: ['Atkinson Hyperlegible', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+9,Modern Professional,operator-active,Poppins,Open Sans,JetBrains Mono,sans+sans,"professional, friendly, corporate, clean, approachable","corporate apps, business dashboards, professional services, portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700&family=Open+Sans:wght@400;500;600;700&display=swap,Geometric Poppins headings sit above humanist Open Sans body so section titles get presence without hurting long-run readability.,@import '@fontsource/poppins/500.css'; @import '@fontsource/poppins/600.css'; @import '@fontsource/poppins/700.css'; @import '@fontsource/open-sans/400.css'; @import '@fontsource/open-sans/500.css'; @import '@fontsource/open-sans/600.css'; @import '@fontsource/open-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Poppins', 'sans-serif'], body: ['Open Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+10,Tech Startup,operator-active,Space Grotesk,DM Sans,JetBrains Mono,sans+sans,"technical, modern, distinctive, product, confident","developer products, technical dashboards, SaaS consoles, data tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap,Space Grotesk lends headings a little engineered character while DM Sans keeps the body plain and dense-friendly.,@import '@fontsource/space-grotesk/500.css'; @import '@fontsource/space-grotesk/600.css'; @import '@fontsource/space-grotesk/700.css'; @import '@fontsource/dm-sans/400.css'; @import '@fontsource/dm-sans/500.css'; @import '@fontsource/dm-sans/600.css'; @import '@fontsource/dm-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Space Grotesk', 'sans-serif'], body: ['DM Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+11,Geometric Modern,operator-active,Outfit,Work Sans,JetBrains Mono,sans+sans,"geometric, contemporary, balanced, versatile, clean","general admin, internal portals, catalog tools, landing-adjacent consoles",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700&family=Work+Sans:wght@400;500;600;700&display=swap,"Outfit gives crisp geometric headings and Work Sans supplies a slightly warmer, workmanlike body underneath.",@import '@fontsource/outfit/500.css'; @import '@fontsource/outfit/600.css'; @import '@fontsource/outfit/700.css'; @import '@fontsource/work-sans/400.css'; @import '@fontsource/work-sans/500.css'; @import '@fontsource/work-sans/600.css'; @import '@fontsource/work-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Outfit', 'sans-serif'], body: ['Work Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+12,Corporate Trust,operator-active,Lexend,Source Sans 3,IBM Plex Mono,sans+sans,"readable, accessible, corporate, calm, dependable","enterprise apps, finance, healthcare, accessibility-focused back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lexend:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Lexend was tuned to ease reading speed, so it earns the heading role over a plain Source Sans 3 body in text-heavy consoles.",@import '@fontsource/lexend/500.css'; @import '@fontsource/lexend/600.css'; @import '@fontsource/lexend/700.css'; @import '@fontsource/source-sans-3/400.css'; @import '@fontsource/source-sans-3/500.css'; @import '@fontsource/source-sans-3/600.css'; @import '@fontsource/source-sans-3/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Lexend', 'sans-serif'], body: ['Source Sans 3', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+13,Medical Clean,operator-active,Figtree,Noto Sans,IBM Plex Mono,sans+sans,"clean, clinical, accessible, calm, professional","healthcare admin, clinical tools, records systems, patient portals",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Figtree:wght@500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap,Figtree stays neutral and clear for headings while Noto Sans covers the wide glyph range clinical data tends to demand.,@import '@fontsource/figtree/500.css'; @import '@fontsource/figtree/600.css'; @import '@fontsource/figtree/700.css'; @import '@fontsource/noto-sans/400.css'; @import '@fontsource/noto-sans/500.css'; @import '@fontsource/noto-sans/600.css'; @import '@fontsource/noto-sans/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Figtree', 'sans-serif'], body: ['Noto Sans', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+14,Commerce Clean,operator-active,Rubik,Nunito Sans,JetBrains Mono,sans+sans,"friendly, retail, clean, approachable, orderly","back-office commerce, order management, catalog admin, fulfillment tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Rubik:wght@500;600;700&family=Nunito+Sans:wght@400;500;600;700&display=swap,Rubik's rounded corners give order screens a little friendliness while Nunito Sans keeps line items quietly legible.,@import '@fontsource/rubik/500.css'; @import '@fontsource/rubik/600.css'; @import '@fontsource/rubik/700.css'; @import '@fontsource/nunito-sans/400.css'; @import '@fontsource/nunito-sans/500.css'; @import '@fontsource/nunito-sans/600.css'; @import '@fontsource/nunito-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Rubik', 'sans-serif'], body: ['Nunito Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+15,Minimalist Portfolio,operator-active,Space Grotesk,Archivo,Space Mono,sans+sans,"minimal, editorial, crisp, design-forward, restrained","design tooling, asset managers, internal editors, review consoles",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Archivo:wght@400;500;600;700&display=swap,Space Grotesk headings stay distinctive against Archivo's tighter grotesque body for tools that want a designed feel.,@import '@fontsource/space-grotesk/500.css'; @import '@fontsource/space-grotesk/600.css'; @import '@fontsource/space-grotesk/700.css'; @import '@fontsource/archivo/400.css'; @import '@fontsource/archivo/500.css'; @import '@fontsource/archivo/600.css'; @import '@fontsource/archivo/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Space Grotesk', 'sans-serif'], body: ['Archivo', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+16,Government Public,operator-active,Public Sans,Source Sans 3,IBM Plex Mono,sans+sans,"civic, neutral, accessible, plain, official","government dashboards, public-sector admin, compliance tools, records",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Public+Sans:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Public Sans carries a civic, standards-driven tone for headings that Source Sans 3 supports without drawing attention.",@import '@fontsource/public-sans/500.css'; @import '@fontsource/public-sans/600.css'; @import '@fontsource/public-sans/700.css'; @import '@fontsource/source-sans-3/400.css'; @import '@fontsource/source-sans-3/500.css'; @import '@fontsource/source-sans-3/600.css'; @import '@fontsource/source-sans-3/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Public Sans', 'sans-serif'], body: ['Source Sans 3', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+17,Technical Data,operator-active,Exo,IBM Plex Sans,Roboto Mono,sans+sans,"technical, engineered, precise, data, modern","engineering dashboards, monitoring, telemetry consoles, ops tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Exo:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,Exo adds a subtle engineered edge to headings while IBM Plex Sans keeps dense telemetry labels grounded and readable.,@import '@fontsource/exo/500.css'; @import '@fontsource/exo/600.css'; @import '@fontsource/exo/700.css'; @import '@fontsource/ibm-plex-sans/400.css'; @import '@fontsource/ibm-plex-sans/500.css'; @import '@fontsource/ibm-plex-sans/600.css'; @import '@fontsource/ibm-plex-sans/700.css'; @import '@fontsource/roboto-mono/400.css'; @import '@fontsource/roboto-mono/500.css';,"fontFamily: { heading: ['Exo', 'sans-serif'], body: ['IBM Plex Sans', 'sans-serif'], mono: ['Roboto Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+18,Condensed Dense,operator-active,Barlow Condensed,Barlow,JetBrains Mono,sans+sans,"condensed, dense, efficient, compact, utilitarian","space-tight dashboards, dense tables, control panels, logistics tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Barlow:wght@400;500;600;700&display=swap,Barlow Condensed packs long headings into narrow columns and shares a family with Barlow body so the two never clash.,@import '@fontsource/barlow-condensed/500.css'; @import '@fontsource/barlow-condensed/600.css'; @import '@fontsource/barlow-condensed/700.css'; @import '@fontsource/barlow/400.css'; @import '@fontsource/barlow/500.css'; @import '@fontsource/barlow/600.css'; @import '@fontsource/barlow/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Barlow Condensed', 'sans-serif'], body: ['Barlow', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3-3.5rem/600-700/0/lh1.05; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+19,Developer Mono,operator-active,JetBrains Mono,IBM Plex Sans,JetBrains Mono,mono+sans,"developer, technical, precise, code, functional","developer tools, CI dashboards, config editors, log viewers",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,JetBrains Mono headings and labels signal a code context while IBM Plex Sans keeps surrounding prose comfortable to read.,@import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css'; @import '@fontsource/jetbrains-mono/700.css'; @import '@fontsource/ibm-plex-sans/400.css'; @import '@fontsource/ibm-plex-sans/500.css'; @import '@fontsource/ibm-plex-sans/600.css'; @import '@fontsource/ibm-plex-sans/700.css';,"fontFamily: { heading: ['JetBrains Mono', 'monospace'], body: ['IBM Plex Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2-2.5rem/600-700/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+20,Dashboard Data,operator-active,Fira Code,Fira Sans,Fira Code,mono+sans,"analytics, technical, data, precise, cohesive","analytics dashboards, metric consoles, query tools, observability",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Fira+Code:wght@500;600;700&family=Fira+Sans:wght@400;500;600;700&display=swap,"The Fira family shares proportions across mono and sans, so figures in Fira Code sit naturally beside Fira Sans labels.",@import '@fontsource/fira-code/400.css'; @import '@fontsource/fira-code/500.css'; @import '@fontsource/fira-code/600.css'; @import '@fontsource/fira-code/700.css'; @import '@fontsource/fira-sans/400.css'; @import '@fontsource/fira-sans/500.css'; @import '@fontsource/fira-sans/600.css'; @import '@fontsource/fira-sans/700.css';,"fontFamily: { heading: ['Fira Code', 'monospace'], body: ['Fira Sans', 'sans-serif'], mono: ['Fira Code', 'monospace'] }",display 2-2.5rem/600-700/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+21,Academic Research,operator-active,Crimson Pro,Atkinson Hyperlegible,IBM Plex Mono,serif+sans,"scholarly, readable, accessible, considered, literate","research admin, academic tools, knowledge bases, review systems",500;600;700,400;700,https://fonts.googleapis.com/css2?family=Crimson+Pro:wght@500;600;700&family=Atkinson+Hyperlegible:wght@400;700&display=swap,Crimson Pro gives headings a scholarly serif voice while Atkinson Hyperlegible keeps the body maximally clear for long reading.,@import '@fontsource/crimson-pro/500.css'; @import '@fontsource/crimson-pro/600.css'; @import '@fontsource/crimson-pro/700.css'; @import '@fontsource/atkinson-hyperlegible/400.css'; @import '@fontsource/atkinson-hyperlegible/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Crimson Pro', 'serif'], body: ['Atkinson Hyperlegible', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+22,News Editorial,operator-active,Newsreader,Roboto,Roboto Mono,serif+sans,"editorial, journalistic, readable, trustworthy, content-rich","content moderation, CMS back-ends, editorial dashboards, review queues",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Newsreader:wght@500;600;700&family=Roboto:wght@400;500;600;700&display=swap,"Newsreader is a text serif rather than a display face, so it heads content-heavy screens without tiring the reader, over a Roboto body.",@import '@fontsource/newsreader/500.css'; @import '@fontsource/newsreader/600.css'; @import '@fontsource/newsreader/700.css'; @import '@fontsource/roboto/400.css'; @import '@fontsource/roboto/500.css'; @import '@fontsource/roboto/600.css'; @import '@fontsource/roboto/700.css'; @import '@fontsource/roboto-mono/400.css'; @import '@fontsource/roboto-mono/500.css';,"fontFamily: { heading: ['Newsreader', 'serif'], body: ['Roboto', 'sans-serif'], mono: ['Roboto Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+23,Legal Records,operator-active,EB Garamond,Lato,IBM Plex Mono,serif+sans,"formal, authoritative, records, considered, traditional","legal ops tools, contract admin, records systems, compliance consoles",500;600;700,400;700,https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500;600;700&family=Lato:wght@400;700&display=swap,"EB Garamond lends record screens a formal, document-like authority in headings that Lato keeps plainly readable in the body.",@import '@fontsource/eb-garamond/500.css'; @import '@fontsource/eb-garamond/600.css'; @import '@fontsource/eb-garamond/700.css'; @import '@fontsource/lato/400.css'; @import '@fontsource/lato/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['EB Garamond', 'serif'], body: ['Lato', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+24,Vietnamese Locale,operator-active,Be Vietnam Pro,Noto Sans,JetBrains Mono,sans+sans,"multilingual, vietnamese, readable, clean, localized","Vietnamese-market tools, multilingual admin, localized back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap,Be Vietnam Pro handles full Vietnamese diacritics cleanly with Noto Sans as a broad fallback for mixed-script data.,@import '@fontsource/be-vietnam-pro/500.css'; @import '@fontsource/be-vietnam-pro/600.css'; @import '@fontsource/be-vietnam-pro/700.css'; @import '@fontsource/noto-sans/400.css'; @import '@fontsource/noto-sans/500.css'; @import '@fontsource/noto-sans/600.css'; @import '@fontsource/noto-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Be Vietnam Pro', 'sans-serif'], body: ['Noto Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+25,Japanese Locale,operator-active,Noto Serif JP,Noto Sans JP,JetBrains Mono,serif+sans,"japanese, multilingual, legible, localized, considered","Japanese-market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap,Noto Serif JP heads Japanese screens with a settled tone while Noto Sans JP keeps dense kana and kanji body text even.,@import '@fontsource/noto-serif-jp/500.css'; @import '@fontsource/noto-serif-jp/600.css'; @import '@fontsource/noto-serif-jp/700.css'; @import '@fontsource/noto-sans-jp/400.css'; @import '@fontsource/noto-sans-jp/500.css'; @import '@fontsource/noto-sans-jp/600.css'; @import '@fontsource/noto-sans-jp/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Serif JP', 'serif'], body: ['Noto Sans JP', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.2; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+26,Korean Locale,operator-active,Noto Sans KR,Noto Sans KR,JetBrains Mono,sans+sans,"korean, multilingual, clean, localized, readable","Korean-market tools, localized admin, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700&display=swap,A single Noto Sans KR system keeps Hangul hierarchy consistent across headings and body without a second face to tune.,@import '@fontsource/noto-sans-kr/400.css'; @import '@fontsource/noto-sans-kr/500.css'; @import '@fontsource/noto-sans-kr/600.css'; @import '@fontsource/noto-sans-kr/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Sans KR', 'sans-serif'], body: ['Noto Sans KR', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.2; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+27,Chinese Simplified Locale,operator-active,Noto Sans SC,Noto Sans SC,JetBrains Mono,sans+sans,"chinese, simplified, multilingual, clean, localized","mainland-market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&display=swap,"Noto Sans SC gives simplified-Chinese operators a full, even glyph set from labels to paragraphs in one family.",@import '@fontsource/noto-sans-sc/400.css'; @import '@fontsource/noto-sans-sc/500.css'; @import '@fontsource/noto-sans-sc/600.css'; @import '@fontsource/noto-sans-sc/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Sans SC', 'sans-serif'], body: ['Noto Sans SC', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.2; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+28,Arabic Locale,operator-active,Noto Naskh Arabic,Noto Sans Arabic,JetBrains Mono,serif+sans,"arabic, rtl, multilingual, localized, readable","Arabic-market admin, RTL dashboards, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Naskh+Arabic:wght@500;600;700&family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap,Noto Naskh Arabic heads RTL screens with a traditional voice while Noto Sans Arabic keeps body and UI text modern and clear.,@import '@fontsource/noto-naskh-arabic/500.css'; @import '@fontsource/noto-naskh-arabic/600.css'; @import '@fontsource/noto-naskh-arabic/700.css'; @import '@fontsource/noto-sans-arabic/400.css'; @import '@fontsource/noto-sans-arabic/500.css'; @import '@fontsource/noto-sans-arabic/600.css'; @import '@fontsource/noto-sans-arabic/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Naskh Arabic', 'serif'], body: ['Noto Sans Arabic', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.3; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+29,Hebrew Locale,operator-active,Noto Sans Hebrew,Noto Sans Hebrew,JetBrains Mono,sans+sans,"hebrew, rtl, multilingual, localized, clean","Hebrew-market tools, RTL admin, bilingual back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+Hebrew:wght@400;500;600;700&display=swap,One Noto Sans Hebrew system keeps RTL hierarchy consistent and legible for Israeli-market internal tools.,@import '@fontsource/noto-sans-hebrew/400.css'; @import '@fontsource/noto-sans-hebrew/500.css'; @import '@fontsource/noto-sans-hebrew/600.css'; @import '@fontsource/noto-sans-hebrew/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Sans Hebrew', 'sans-serif'], body: ['Noto Sans Hebrew', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.2; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+30,Thai Locale,operator-active,Noto Sans Thai,Noto Sans Thai,JetBrains Mono,sans+sans,"thai, multilingual, readable, localized, clean","Thai-market admin, localized consoles, SEA back-office",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap,"Noto Sans Thai renders looped Thai script clearly at UI sizes, carrying both heading and body in one dependable family.",@import '@fontsource/noto-sans-thai/400.css'; @import '@fontsource/noto-sans-thai/500.css'; @import '@fontsource/noto-sans-thai/600.css'; @import '@fontsource/noto-sans-thai/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Sans Thai', 'sans-serif'], body: ['Noto Sans Thai', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.3; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+31,Chinese Traditional Locale,operator-active,Noto Serif TC,Noto Sans TC,JetBrains Mono,serif+sans,"chinese, traditional, multilingual, localized, considered","Taiwan and Hong Kong market admin, localized consoles, bilingual tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap,Noto Serif TC gives traditional-Chinese headings a measured tone with Noto Sans TC handling denser body text.,@import '@fontsource/noto-serif-tc/500.css'; @import '@fontsource/noto-serif-tc/600.css'; @import '@fontsource/noto-serif-tc/700.css'; @import '@fontsource/noto-sans-tc/400.css'; @import '@fontsource/noto-sans-tc/500.css'; @import '@fontsource/noto-sans-tc/600.css'; @import '@fontsource/noto-sans-tc/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Noto Serif TC', 'serif'], body: ['Noto Sans TC', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.2; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+32,Rounded Legible,operator-active,Nunito Sans,Nunito Sans,JetBrains Mono,sans+sans,"rounded, friendly, legible, calm, approachable","support consoles, CRM back-office, help desks, customer-facing admin",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700&display=swap,Nunito Sans softens a support console's tone with gently rounded terminals while staying legible enough for all-day use.,@import '@fontsource/nunito-sans/400.css'; @import '@fontsource/nunito-sans/500.css'; @import '@fontsource/nunito-sans/600.css'; @import '@fontsource/nunito-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Nunito Sans', 'sans-serif'], body: ['Nunito Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+33,Grotesque Utility,operator-active,Karla,Karla,Space Mono,sans+sans,"grotesque, utilitarian, compact, plain, efficient","utility dashboards, config panels, small-footprint tools, forms",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Karla:wght@400;500;600;700&display=swap,"Karla is a tidy grotesque whose narrow set width fits more label text per row, useful when screen real estate is tight.",@import '@fontsource/karla/400.css'; @import '@fontsource/karla/500.css'; @import '@fontsource/karla/600.css'; @import '@fontsource/karla/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Karla', 'sans-serif'], body: ['Karla', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+34,Classic Elegant,operator-active,Playfair Display,Inter,JetBrains Mono,serif+sans,"elegant, luxury, editorial, high-contrast, premium","wealth and private-banking consoles, luxury commerce admin, premium client portals, editorial CMS",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap,"Playfair Display appears only at H1 and H2 over a working Inter body, giving premium verticals a confident display serif without costing table legibility.",@import '@fontsource/playfair-display/500.css'; @import '@fontsource/playfair-display/600.css'; @import '@fontsource/playfair-display/700.css'; @import '@fontsource/inter/400.css'; @import '@fontsource/inter/500.css'; @import '@fontsource/inter/600.css'; @import '@fontsource/inter/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Playfair Display', 'serif'], body: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+35,Playful Creative,operator-active,Fredoka,Nunito,Space Mono,display+sans,"playful, friendly, fun, rounded, warm","education platform admin, classroom management tools, kids-product back-office, learning dashboards",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Nunito:wght@400;500;600;700&display=swap,Rounded Fredoka headings keep an education product's operator surfaces on brand while the Nunito body stays legible through long grading and roster screens.,@import '@fontsource/fredoka/500.css'; @import '@fontsource/fredoka/600.css'; @import '@fontsource/fredoka/700.css'; @import '@fontsource/nunito/400.css'; @import '@fontsource/nunito/500.css'; @import '@fontsource/nunito/600.css'; @import '@fontsource/nunito/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Fredoka', 'sans-serif'], body: ['Nunito', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+36,Wellness Calm,operator-active,Lora,Raleway,IBM Plex Mono,serif+sans,"calm, wellness, organic, gentle, natural","wellness platform admin, clinic and spa back-office, care coordination tools, patient program consoles",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lora:wght@500;600;700&family=Raleway:wght@400;500;600;700&display=swap,Lora is a sturdy text serif that keeps wellness operators' headings calm while Raleway carries labels and body copy cleanly at UI sizes.,@import '@fontsource/lora/500.css'; @import '@fontsource/lora/600.css'; @import '@fontsource/lora/700.css'; @import '@fontsource/raleway/400.css'; @import '@fontsource/raleway/500.css'; @import '@fontsource/raleway/600.css'; @import '@fontsource/raleway/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Lora', 'serif'], body: ['Raleway', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+37,Fashion Forward,operator-active,Syne,Manrope,JetBrains Mono,sans+sans,"avant-garde, artistic, edgy, creative, bold","design tool consoles, creative agency admin, brand asset managers, review and approval tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Syne:wght@500;600;700&family=Manrope:wght@400;500;600;700&display=swap,Syne's engineered quirk gives creative-tool headings an art-directed voice while Manrope keeps the working body plain and dense-friendly.,@import '@fontsource/syne/500.css'; @import '@fontsource/syne/600.css'; @import '@fontsource/syne/700.css'; @import '@fontsource/manrope/400.css'; @import '@fontsource/manrope/500.css'; @import '@fontsource/manrope/600.css'; @import '@fontsource/manrope/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Syne', 'sans-serif'], body: ['Manrope', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+38,SaaS Boutique,operator-active,Calistoga,Inter,JetBrains Mono,serif+sans,"boutique, warm, editorial, bold, characterful","boutique SaaS dashboards, analytics consoles, billing and usage surfaces, marketing ops tools",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Calistoga:wght@400&family=Inter:wght@400;500;600;700&display=swap,"Calistoga's warm single-weight display carries H1 and H2 personality while the full Inter system does the operator work underneath, a boutique-SaaS look that survives dense screens.",@import '@fontsource/calistoga/400.css'; @import '@fontsource/inter/400.css'; @import '@fontsource/inter/500.css'; @import '@fontsource/inter/600.css'; @import '@fontsource/inter/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Calistoga', 'serif'], body: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/400/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+39,Web3 Fintech,operator-active,Space Grotesk,Inter,JetBrains Mono,sans+sans,"crypto, fintech, technical, precise, confident","DeFi and wallet consoles, trading dashboards, token analytics, blockchain ops tools",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap,Space Grotesk headings give crypto consoles their engineered edge while Inter body and JetBrains Mono figures keep balances and hashes rigorously legible.,@import '@fontsource/space-grotesk/500.css'; @import '@fontsource/space-grotesk/600.css'; @import '@fontsource/space-grotesk/700.css'; @import '@fontsource/inter/400.css'; @import '@fontsource/inter/500.css'; @import '@fontsource/inter/600.css'; @import '@fontsource/inter/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Space Grotesk', 'sans-serif'], body: ['Inter', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/-0.02em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+40,Editorial Classic,dormant-marketing,Cormorant Garamond,Libre Baskerville,IBM Plex Mono,serif+serif,"editorial, literary, traditional, refined, bookish","publishing, literary magazines, long-form editorial, book sites",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Libre+Baskerville:wght@400;500;600;700&display=swap,"An all-serif pairing leans fully literary, which suits editorial publishing but is too low-contrast for scanning operator data.",@import '@fontsource/cormorant-garamond/500.css'; @import '@fontsource/cormorant-garamond/600.css'; @import '@fontsource/cormorant-garamond/700.css'; @import '@fontsource/libre-baskerville/400.css'; @import '@fontsource/libre-baskerville/500.css'; @import '@fontsource/libre-baskerville/600.css'; @import '@fontsource/libre-baskerville/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Cormorant Garamond', 'serif'], body: ['Libre Baskerville', 'serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+41,Bold Statement,dormant-marketing,Bebas Neue,Source Sans 3,JetBrains Mono,display+sans,"bold, impactful, headline, dramatic, loud","marketing heroes, event pages, agencies, campaign landing",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Bebas+Neue:wght@400&family=Source+Sans+3:wght@400;500;600;700&display=swap,"Bebas Neue is an all-caps display face for oversized headlines only, which is why it lives in the marketing pack, not the operator set.",@import '@fontsource/bebas-neue/400.css'; @import '@fontsource/source-sans-3/400.css'; @import '@fontsource/source-sans-3/500.css'; @import '@fontsource/source-sans-3/600.css'; @import '@fontsource/source-sans-3/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Bebas Neue', 'sans-serif'], body: ['Source Sans 3', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3.5-4rem/400/+0.02em/lh1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+42,Retro Vintage,dormant-marketing,Abril Fatface,Merriweather,Space Mono,serif+serif,"retro, vintage, dramatic, decorative, nostalgic","vintage brands, breweries, restaurants, poster-style marketing",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Abril+Fatface:wght@400&family=Merriweather:wght@400;500;600;700&display=swap,"Abril Fatface's heavy Didone hairlines make a striking vintage hero serif reserved for headlines, paired with Merriweather body.",@import '@fontsource/abril-fatface/400.css'; @import '@fontsource/merriweather/400.css'; @import '@fontsource/merriweather/500.css'; @import '@fontsource/merriweather/600.css'; @import '@fontsource/merriweather/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Abril Fatface', 'serif'], body: ['Merriweather', 'serif'], mono: ['Space Mono', 'monospace'] }",display 3-3.5rem/400/0/lh1.05; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+43,Luxury Serif,dormant-marketing,Cormorant,Montserrat,IBM Plex Mono,serif+sans,"luxury, fashion, refined, premium, high-end","fashion houses, jewelry, luxury e-commerce, premium services",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cormorant:wght@500;600;700&family=Montserrat:wght@400;500;600;700&display=swap,Cormorant's delicate high-contrast forms read as luxury marketing and would wash out in the small sizes operator tables use.,@import '@fontsource/cormorant/500.css'; @import '@fontsource/cormorant/600.css'; @import '@fontsource/cormorant/700.css'; @import '@fontsource/montserrat/400.css'; @import '@fontsource/montserrat/500.css'; @import '@fontsource/montserrat/600.css'; @import '@fontsource/montserrat/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Cormorant', 'serif'], body: ['Montserrat', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+44,Handwritten Charm,dormant-marketing,Caveat,Quicksand,Space Mono,display+sans,"handwritten, personal, casual, warm, charming","personal brands, invitations, lifestyle marketing, creative portfolios",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Quicksand:wght@400;500;600;700&display=swap,"Caveat is a script accent for personality-driven marketing, unusable as working type but kept for the campaign pack.",@import '@fontsource/caveat/500.css'; @import '@fontsource/caveat/600.css'; @import '@fontsource/caveat/700.css'; @import '@fontsource/quicksand/400.css'; @import '@fontsource/quicksand/500.css'; @import '@fontsource/quicksand/600.css'; @import '@fontsource/quicksand/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Caveat', 'cursive'], body: ['Quicksand', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/0/lh1.15; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+45,Soft Rounded,dormant-marketing,Varela Round,Nunito Sans,JetBrains Mono,sans+sans,"soft, rounded, friendly, gentle, warm","kids and pet brands, wellness marketing, soft consumer UI",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Varela+Round:wght@400&family=Nunito+Sans:wght@400;500;600;700&display=swap,Fully rounded Varela Round headings set a soft consumer mood aimed at friendly marketing rather than dense operator work.,@import '@fontsource/varela-round/400.css'; @import '@fontsource/nunito-sans/400.css'; @import '@fontsource/nunito-sans/500.css'; @import '@fontsource/nunito-sans/600.css'; @import '@fontsource/nunito-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Varela Round', 'sans-serif'], body: ['Nunito Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/400/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+46,Magazine Style,dormant-marketing,Libre Bodoni,Public Sans,IBM Plex Mono,serif+sans,"magazine, editorial, print, refined, journalistic","online magazines, editorial features, publishing marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Libre+Bodoni:wght@500;600;700&family=Public+Sans:wght@400;500;600;700&display=swap,Libre Bodoni's print-magazine contrast makes expressive feature headings that suit publishing marketing over back-office reading.,@import '@fontsource/libre-bodoni/500.css'; @import '@fontsource/libre-bodoni/600.css'; @import '@fontsource/libre-bodoni/700.css'; @import '@fontsource/public-sans/400.css'; @import '@fontsource/public-sans/500.css'; @import '@fontsource/public-sans/600.css'; @import '@fontsource/public-sans/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Libre Bodoni', 'serif'], body: ['Public Sans', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+47,Cyberpunk Web3,dormant-marketing,Orbitron,Exo 2,JetBrains Mono,display+sans,"futuristic, crypto, neon, sci-fi, technical","crypto and web3 marketing, NFT sites, gaming, futuristic brands",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700&family=Exo+2:wght@400;500;600;700&display=swap,"Orbitron's wide sci-fi caps brand crypto and gaming marketing pages, a decorative look kept clear of real data screens.",@import '@fontsource/orbitron/500.css'; @import '@fontsource/orbitron/600.css'; @import '@fontsource/orbitron/700.css'; @import '@fontsource/exo-2/400.css'; @import '@fontsource/exo-2/500.css'; @import '@fontsource/exo-2/600.css'; @import '@fontsource/exo-2/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Orbitron', 'sans-serif'], body: ['Exo 2', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.5-3rem/600-700/+0.04em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+48,Gaming Bold,dormant-marketing,Russo One,Chakra Petch,Space Mono,display+sans,"gaming, bold, esports, energetic, competitive","gaming and esports marketing, tournaments, entertainment brands",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Russo+One:wght@400&family=Chakra+Petch:wght@400;500;600;700&display=swap,"Russo One's blocky impact suits esports headlines while Chakra Petch adds a techy body, a pairing tuned for hype not throughput.",@import '@fontsource/russo-one/400.css'; @import '@fontsource/chakra-petch/400.css'; @import '@fontsource/chakra-petch/500.css'; @import '@fontsource/chakra-petch/600.css'; @import '@fontsource/chakra-petch/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Russo One', 'sans-serif'], body: ['Chakra Petch', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 3-3.5rem/400/0/lh1.05; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+49,Real Estate Luxury,dormant-marketing,Cinzel,Josefin Sans,IBM Plex Mono,serif+sans,"luxury, architectural, refined, premium, elegant","luxury real estate, architecture, interiors, premium property marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Josefin+Sans:wght@400;500;600;700&display=swap,"Cinzel's engraved Roman capitals evoke premium property branding, a display serif meant for hero titles rather than dense listings.",@import '@fontsource/cinzel/500.css'; @import '@fontsource/cinzel/600.css'; @import '@fontsource/cinzel/700.css'; @import '@fontsource/josefin-sans/400.css'; @import '@fontsource/josefin-sans/500.css'; @import '@fontsource/josefin-sans/600.css'; @import '@fontsource/josefin-sans/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Cinzel', 'serif'], body: ['Josefin Sans', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/+0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+50,Luxury Minimalist,dormant-marketing,Bodoni Moda,Jost,IBM Plex Mono,serif+sans,"luxury, minimalist, high-contrast, refined, premium","high-end fashion, premium minimal brands, luxury product marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@500;600;700&family=Jost:wght@400;500;600;700&display=swap,"Bodoni Moda's extreme contrast reads as minimalist luxury in headlines, paired with geometric Jost, and stays in the marketing pack.",@import '@fontsource/bodoni-moda/500.css'; @import '@fontsource/bodoni-moda/600.css'; @import '@fontsource/bodoni-moda/700.css'; @import '@fontsource/jost/400.css'; @import '@fontsource/jost/500.css'; @import '@fontsource/jost/600.css'; @import '@fontsource/jost/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Bodoni Moda', 'serif'], body: ['Jost', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+51,Neubrutalist Bold,dormant-marketing,Lexend Mega,Public Sans,JetBrains Mono,display+sans,"neubrutalist, loud, geometric, bold, quirky","neubrutalist marketing, Gen Z brands, bold campaign pages",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Lexend+Mega:wght@500;600;700&family=Public+Sans:wght@400;500;600;700&display=swap,"Lexend Mega's ultra-wide tracking is a deliberately loud neubrutalist statement for campaigns, not a workaday heading face.",@import '@fontsource/lexend-mega/500.css'; @import '@fontsource/lexend-mega/600.css'; @import '@fontsource/lexend-mega/700.css'; @import '@fontsource/public-sans/400.css'; @import '@fontsource/public-sans/500.css'; @import '@fontsource/public-sans/600.css'; @import '@fontsource/public-sans/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Lexend Mega', 'sans-serif'], body: ['Public Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.25-2.75rem/600-700/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+52,Gen Z Brutal,dormant-marketing,Anton,Epilogue,JetBrains Mono,display+sans,"brutal, loud, streetwear, meme, bold","streetwear, viral campaigns, Gen Z marketing, sticker packs",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Anton:wght@400&family=Epilogue:wght@400;500;600;700&display=swap,"Anton's condensed black weight shouts for streetwear and meme campaigns, an intentionally aggressive display voice kept dormant.",@import '@fontsource/anton/400.css'; @import '@fontsource/epilogue/400.css'; @import '@fontsource/epilogue/500.css'; @import '@fontsource/epilogue/600.css'; @import '@fontsource/epilogue/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Anton', 'sans-serif'], body: ['Epilogue', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3.5-4rem/400/+0.01em/lh1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+53,Bauhaus Geometric,dormant-marketing,Outfit,Outfit,JetBrains Mono,sans+sans,"bauhaus, geometric, constructivist, poster, architectural","design-forward brand marketing, art and culture, poster-style sites",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap,"A single Outfit set at heavy uppercase weights makes a Bauhaus poster system that is expressive branding, not operator hierarchy.",@import '@fontsource/outfit/400.css'; @import '@fontsource/outfit/500.css'; @import '@fontsource/outfit/600.css'; @import '@fontsource/outfit/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Outfit', 'sans-serif'], body: ['Outfit', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3-3.5rem/600-700/-0.02em/lh1.05; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+54,Monochrome Editorial,dormant-marketing,Playfair Display,Source Serif 4,JetBrains Mono,serif+serif,"monochrome, editorial, austere, high-contrast, typographic","luxury fashion editorial, digital exhibitions, portfolio marketing",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Source+Serif+4:wght@400;500;600;700&display=swap,"Playfair Display over Source Serif 4 makes an austere all-serif editorial statement built for display, not for scanning records.",@import '@fontsource/playfair-display/500.css'; @import '@fontsource/playfair-display/600.css'; @import '@fontsource/playfair-display/700.css'; @import '@fontsource/source-serif-4/400.css'; @import '@fontsource/source-serif-4/500.css'; @import '@fontsource/source-serif-4/600.css'; @import '@fontsource/source-serif-4/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Playfair Display', 'serif'], body: ['Source Serif 4', 'serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.05; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+55,Kinetic Brutalism,dormant-marketing,Space Grotesk,Space Grotesk,Space Mono,sans+sans,"kinetic, brutalist, oversized, street, high-energy","music and culture marketing, sports brands, flagship campaign pages",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap,"Pushed to oversized uppercase weights, a single Space Grotesk becomes a high-energy brutalist system tuned for motion-heavy marketing.",@import '@fontsource/space-grotesk/400.css'; @import '@fontsource/space-grotesk/500.css'; @import '@fontsource/space-grotesk/600.css'; @import '@fontsource/space-grotesk/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Space Grotesk', 'sans-serif'], body: ['Space Grotesk', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 3-3.5rem/600-700/-0.02em/lh1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+56,Terminal CLI,dormant-marketing,JetBrains Mono,IBM Plex Sans,JetBrains Mono,mono+sans,"terminal, hacker, retro-future, technical, aesthetic","hacker-aesthetic marketing, web3 landing, security-brand campaigns",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600;700&display=swap,An all-mono terminal aesthetic reads as a stylistic hacker brand for marketing; the sans body keeps it from becoming unreadable at length.,@import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css'; @import '@fontsource/jetbrains-mono/700.css'; @import '@fontsource/ibm-plex-sans/400.css'; @import '@fontsource/ibm-plex-sans/500.css'; @import '@fontsource/ibm-plex-sans/600.css'; @import '@fontsource/ibm-plex-sans/700.css';,"fontFamily: { heading: ['JetBrains Mono', 'monospace'], body: ['IBM Plex Sans', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 2-2.5rem/600-700/0/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+57,Art Deco,dormant-marketing,Poiret One,Didact Gothic,JetBrains Mono,display+sans,"art-deco, vintage, 1920s, decorative, elegant","art-deco event marketing, luxury hotels, period-themed brands",400,400,https://fonts.googleapis.com/css2?family=Poiret+One:wght@400&family=Didact+Gothic:wght@400&display=swap,"Poiret One's thin geometric Deco lines evoke the 1920s for themed marketing, a decorative heading unfit for functional density.",@import '@fontsource/poiret-one/400.css'; @import '@fontsource/didact-gothic/400.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Poiret One', 'sans-serif'], body: ['Didact Gothic', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3-3.5rem/400/+0.04em/lh1.1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+58,Restaurant Menu,dormant-marketing,Playfair Display SC,Karla,IBM Plex Mono,serif+sans,"culinary, hospitality, elegant, menu, refined","restaurant and cafe marketing, food brands, hospitality sites",700,400;500;600;700,https://fonts.googleapis.com/css2?family=Playfair+Display+SC:wght@700&family=Karla:wght@400;500;600;700&display=swap,"Small-caps Playfair sets refined menu headers over a plain Karla body, a hospitality-marketing look rather than an operator surface.",@import '@fontsource/playfair-display-sc/700.css'; @import '@fontsource/karla/400.css'; @import '@fontsource/karla/500.css'; @import '@fontsource/karla/600.css'; @import '@fontsource/karla/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Playfair Display SC', 'serif'], body: ['Karla', 'sans-serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.5-3rem/700/+0.02em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+59,Kids Education,dormant-marketing,Baloo 2,Nunito,Space Mono,display+sans,"playful, education, colorful, friendly, learning","children's education marketing, kids apps, learning brands",500;600;700,400;500;600;700,https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700&family=Nunito:wght@400;500;600;700&display=swap,"Chunky rounded Baloo 2 headings signal a kid-friendly product for education marketing, with Nunito supplying a legible playful body.",@import '@fontsource/baloo-2/500.css'; @import '@fontsource/baloo-2/600.css'; @import '@fontsource/baloo-2/700.css'; @import '@fontsource/nunito/400.css'; @import '@fontsource/nunito/500.css'; @import '@fontsource/nunito/600.css'; @import '@fontsource/nunito/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Baloo 2', 'sans-serif'], body: ['Nunito', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/600-700/0/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+60,Indie Craft,dormant-marketing,Amatic SC,Cabin,JetBrains Mono,display+sans,"indie, craft, handmade, artisan, organic","craft and artisan marketing, handmade goods, indie brands",700,400;500;600;700,https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&family=Cabin:wght@400;500;600;700&display=swap,"Amatic SC's thin hand-drawn caps give artisan marketing a handmade feel, a decorative accent paired with a steady Cabin body.",@import '@fontsource/amatic-sc/700.css'; @import '@fontsource/cabin/400.css'; @import '@fontsource/cabin/500.css'; @import '@fontsource/cabin/600.css'; @import '@fontsource/cabin/700.css'; @import '@fontsource/jetbrains-mono/400.css'; @import '@fontsource/jetbrains-mono/500.css'; @import '@fontsource/jetbrains-mono/600.css';,"fontFamily: { heading: ['Amatic SC', 'sans-serif'], body: ['Cabin', 'sans-serif'], mono: ['JetBrains Mono', 'monospace'] }",display 3.5-4rem/700/+0.02em/lh1; kpi mono 1.75-2.5rem/500-600/lh1 tabular-nums
+61,Music Entertainment,dormant-marketing,Righteous,Poppins,Space Mono,display+sans,"music, entertainment, energetic, bold, festive","music and event marketing, festivals, entertainment brands",400,400;500;600;700,https://fonts.googleapis.com/css2?family=Righteous:wght@400&family=Poppins:wght@400;500;600;700&display=swap,"Righteous's rounded retro display suits music and festival headlines, an energetic marketing voice over a Poppins body.",@import '@fontsource/righteous/400.css'; @import '@fontsource/poppins/400.css'; @import '@fontsource/poppins/500.css'; @import '@fontsource/poppins/600.css'; @import '@fontsource/poppins/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Righteous', 'sans-serif'], body: ['Poppins', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 3-3.5rem/400/0/lh1.05; kpi mono 1.75-2.25rem/700/lh1 tabular-nums
+62,Scholarly Archive,dormant-marketing,Cormorant Garamond,Crimson Pro,IBM Plex Mono,serif+serif,"scholarly, antique, prestige, literary, traditional","heritage and library brands, scholarly reading apps, cultural platforms, archive-themed marketing",500;600;700,500;600;700,https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Crimson+Pro:wght@500;600;700&display=swap,"Cormorant Garamond over a Crimson Pro book serif reads like a private library for heritage marketing, an all-serif stack too delicate for scanning operator data.",@import '@fontsource/cormorant-garamond/500.css'; @import '@fontsource/cormorant-garamond/600.css'; @import '@fontsource/cormorant-garamond/700.css'; @import '@fontsource/crimson-pro/500.css'; @import '@fontsource/crimson-pro/600.css'; @import '@fontsource/crimson-pro/700.css'; @import '@fontsource/ibm-plex-mono/400.css'; @import '@fontsource/ibm-plex-mono/500.css';,"fontFamily: { heading: ['Cormorant Garamond', 'serif'], body: ['Crimson Pro', 'serif'], mono: ['IBM Plex Mono', 'monospace'] }",display 2.75-3.25rem/600-700/-0.01em/lh1.1; kpi mono 1.75-2.5rem/500/lh1 tabular-nums
+63,Clay Playful,dormant-marketing,Nunito,DM Sans,Space Mono,sans+sans,"clay, bubbly, tactile, playful, soft","children's education marketing, teen social apps, mascot-led brands, gamified consumer products",700,400;500;600;700,https://fonts.googleapis.com/css2?family=Nunito:wght@700&family=DM+Sans:wght@400;500;600;700&display=swap,"Heavy rounded Nunito headings over a plain DM Sans body give claymorphic consumer surfaces their bubbly voice, a look built for playful marketing rather than dense operator work.",@import '@fontsource/nunito/700.css'; @import '@fontsource/dm-sans/400.css'; @import '@fontsource/dm-sans/500.css'; @import '@fontsource/dm-sans/600.css'; @import '@fontsource/dm-sans/700.css'; @import '@fontsource/space-mono/400.css'; @import '@fontsource/space-mono/700.css';,"fontFamily: { heading: ['Nunito', 'sans-serif'], body: ['DM Sans', 'sans-serif'], mono: ['Space Mono', 'monospace'] }",display 2.5-3rem/700/-0.01em/lh1.1; kpi mono 1.75-2.25rem/700/lh1 tabular-nums

package/data/harnesses/code/skills/design/data/design-md/library/expo.md CHANGED Viewed

@@ -52,7 +52,7 @@ surfaces (`#171717` feature cards) are marketing devices; they carry no operator
 One sans, one mono. `font-sans` is Inter — UI, body, and headings all ride it; heading weight and
 negative tracking, not a second family, carry the editorial voice (display weight holds at 600, never
 700). `font-mono` is JetBrains Mono for IDs, codes, timestamps, and log lines. Numeric columns render
-`tabular-nums` so figures align down a column (floor P4).
+`tabular-nums` so figures align down a column (floor f04).
 | Step | Role | Size · line | Weight · tracking |
 | --- | --- | --- | --- |
@@ -81,7 +81,7 @@ Every recurring operator component composes from the primitives — no literal v
 - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
   numeric columns; row selection tints `accent`.
 - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`
-  for content-heavy), beside the work, not over it (floor P3).
+  for content-heavy), beside the work, not over it (floor f03).
 - **Badge** — pill (9999) with uppercase caption on a `muted` fill; status badges take
   `success` / `warning` / `destructive`, never `primary`.
@@ -104,7 +104,7 @@ Flat and editorial. Hierarchy comes from the surface ladder and hairlines, not s
 - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
   shadow. Rank is border and position, never a heavier stacked shadow.
-Focus is a 2px `ring` outline in ink (never a glow), visible on every interactive element (floor P6).
+Focus is a 2px `ring` outline in ink (never a glow), visible on every interactive element (floor f06).
 Three z-levels: content, sticky chrome, overlay. The sky-gradient backdrop and dark-inversion surfaces
 are marketing depth and do not appear in operator chrome.
@@ -145,4 +145,4 @@ Directives the emitting agent follows verbatim for an operator surface wearing E
 - Leave the marketing devices behind: no sky-gradient wash, no device-mockup hero, no 64px display
   type, no dark-inversion feature cards. What carries is the palette, the cool-neutral temperature, the
   8px/12px radius character, and the Inter + JetBrains Mono voice.
-- Every workflow completes from the keyboard; the ink `ring` focus outline is always visible (P6).
+- Every workflow completes from the keyboard; the ink `ring` focus outline is always visible (f06).

package/data/harnesses/code/skills/design/data/design-md/library/lovable.md CHANGED Viewed

@@ -51,7 +51,7 @@ One sans, one mono. `font-sans` is Camera Plain Variable — a humanist face wit
 gives the tool its warmth; the UI, body, and headings all ride it (`ui-sans-serif, system-ui` fallbacks).
 Weight range is narrow: 400 for body/UI, 600 for headings (600 is the ceiling — never 700). `font-mono`
 is derived (no brand mono documented) for IDs, codes, timestamps, and log lines. Numeric columns render
-`tabular-nums` so figures align down a column (floor P4).
+`tabular-nums` so figures align down a column (floor f04).
 | Step | Role | Size · line | Weight · tracking |
 | --- | --- | --- | --- |
@@ -79,7 +79,7 @@ Every recurring operator component composes from the primitives — no literal v
 - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
   numeric columns; row selection tints `accent`.
 - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`),
-  beside the work, not over it (floor P3).
+  beside the work, not over it (floor f03).
 - **Badge** — hairline `border`, `muted`/status fill; status badges take `success` / `warning` /
   `destructive`, never `primary`. The full-pill `9999px` radius is reserved for icon toggles only.
@@ -101,7 +101,7 @@ Flat and shallow. Hierarchy comes from the warm hairline against the cream surfa
 - **2 — overlay** `popover` / side panel / modal lifts a half-step to off-white and earns a single soft,
   diffused shadow (`shadow-intensity` → `md`) — the brand's warm glow, never a sharp drop.
-Focus is the `ring` outline on every interactive element (floor P6); the soft warm focus shadow
+Focus is the `ring` outline on every interactive element (floor f06); the soft warm focus shadow
 (`rgba(0,0,0,0.1) 0px 4px 12px`) is the active-state treatment. Three z-levels: content, chrome, overlay.
 ## 7 Do's & Don'ts
@@ -135,6 +135,6 @@ What carries from Lovable onto an operator tool, and what stays behind:
 - **One accent, achromatic**: charcoal `primary` is the emphasis (if two things want it, one is not
   primary); derive every muted fill and border from charcoal-over-cream, never a cold gray.
 - **Flat before lifted**: warm `#eceae4` hairline before any shadow; reach past it only for a real overlay, and then only the soft diffused glow.
-- **Numbers**: every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (P4).
-- **Keyboard-first**: every workflow completes from the keyboard; the `ring` focus outline is always visible (P6).
+- **Numbers**: every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (f04).
+- **Keyboard-first**: every workflow completes from the keyboard; the `ring` focus outline is always visible (f06).
 - **Left behind** (marketing only): hero type at 36–60px, display-scale negative tracking, the gradient washes, the 96–208px editorial spacing. Warmth comes from palette and type, not lavish gaps.

package/data/harnesses/code/skills/design/data/design-md/library/minimax.md CHANGED Viewed

@@ -51,7 +51,7 @@ The vibrant brand colors — coral `#ff5530`, magenta `#ea5ec1`, blue `#1456f0`,
 One sans, one mono. `font-sans` is DM Sans — UI, body, and headings all ride it; the brand mixes no
 second sans, and emphasis comes from weight (400 / 500 / 600 / 700). `font-mono` is a system monospace
 for IDs, codes, timestamps, and log lines (the brand ships no dedicated mono). Numeric columns render
-`tabular-nums` so figures align down a column (floor P4).
+`tabular-nums` so figures align down a column (floor f04).
 | Step | Role | Size · line | Weight · tracking |
 | --- | --- | --- | --- |
@@ -76,7 +76,7 @@ Every recurring operator component composes from the primitives — no literal v
 - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
   numeric columns; selection tints `accent` (neutral, not blue).
 - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`),
-  beside the work, not over it (floor P3).
+  beside the work, not over it (floor f03).
 - **Badge** — the one place the pill survives: `radius-scale` full (9999), `muted`/status fill, uppercase
   caption. Status badges take `success` / `warning` / `destructive`, never `primary`.
@@ -97,7 +97,7 @@ Flat; hierarchy comes from the surface ladder and hairlines, not shadow:
 - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
   shadow. Rank is border and position, never a heavier shadow.
-Focus is a 2px `ring` outline in deep blue (never a glow), on every interactive element (floor P6). Three
+Focus is a 2px `ring` outline in deep blue (never a glow), on every interactive element (floor f06). Three
 z-levels: content, sticky chrome, overlay.
 ## 7 Do's & Don'ts
@@ -133,7 +133,7 @@ Directives the emitting agent follows verbatim:
 - **Stays behind:** the gradient product cards, the pill-everything CTA, and the hero-scale 80px display
   type with -2px tracking. None of it enters operator chrome.
 - Lead every list surface with its table; lead every entity with its primary read, not its chrome. Detail
-  and edit go in the side panel; a modal is a confirmation, not a workspace (P3).
+  and edit go in the side panel; a modal is a confirmation, not a workspace (f03).
 - Accent only the primary action; the one chromatic accent (blue) is for focus and links.
-- Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (P4). Keyboard
-  completes every workflow; the `ring` focus outline is always visible (P6). Stay flat — hairline before shadow.
+- Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (f04). Keyboard
+  completes every workflow; the `ring` focus outline is always visible (f06). Stay flat — hairline before shadow.

package/data/harnesses/code/skills/design/data/design-md/library/notion.md CHANGED Viewed

@@ -53,7 +53,7 @@ CTAs never share a hue). The pastel feature tints and the navy hero are brand gr
 One sans, one mono. `font-sans` is Inter — Notion Sans is an Inter-based proprietary variable face, so the
 operator wears its documented fallback; body, UI, and headings all ride it, with weight and tracking (not
 a second family) carrying the display voice. `font-mono` serves IDs, codes, timestamps, and log lines.
-Numeric columns render `tabular-nums` so figures align down a column (floor P4).
+Numeric columns render `tabular-nums` so figures align down a column (floor f04).
 | Step | Role | Size · line | Weight · tracking |
 | --- | --- | --- | --- |
@@ -80,7 +80,7 @@ Every recurring operator component composes from the primitives — no literal v
 - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
   numeric columns; row selection tints `accent` (lavender).
 - **Side panel** — detail and edit open beside the work (`side-panel-width` / `side-panel-width-rich`),
-  not over it (floor P3).
+  not over it (floor f03).
 - **Badge** — status badges take the pill radius (`9999`) with `success` / `warning` / `destructive`
   fills; a feature tag chip is a soft `radius`-4 rectangle in `accent` on `accent-foreground`.
@@ -136,5 +136,5 @@ Directives the emitting agent follows verbatim:
 - Accent only the primary action with purple. Inline links are link-blue; the two hues never merge.
 - Selection and hover tint `accent` (lavender); the pastel rainbow and the navy hero stay behind.
 - Sober rectangles: 8px buttons, 12px cards. Pills are for status badges only — never the CTA.
-- Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (P4).
-- Every workflow completes from the keyboard, `ring` focus always visible (P6); stay flat — hairline and weight before shadow, reaching past a hairline only for a real overlay.
+- Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono` (f04).
+- Every workflow completes from the keyboard, `ring` focus always visible (f06); stay flat — hairline and weight before shadow, reaching past a hairline only for a real overlay.

package/data/harnesses/code/skills/design/data/design-md/library/runwayml.md CHANGED Viewed

@@ -52,7 +52,7 @@ geometric sibling), with Inter as the robust fallback. Variety comes from size,
 tracking, never a second family. Heading tracking runs tight and negative (film-title density); the
 weight range is 400–600 and **never reaches 700+**. Uppercase micro-labels take *positive* tracking
 (`+0.02em`) as navigational signposts. `font-mono` (Geist Mono, derived — the brand is single-family)
-serves IDs, codes, timestamps, and log lines; numeric columns render `tabular-nums` (floor P4).
+serves IDs, codes, timestamps, and log lines; numeric columns render `tabular-nums` (floor f04).
 | Step | Role | Size · line | Weight · tracking |
 | --- | --- | --- | --- |
@@ -73,7 +73,7 @@ Every recurring component composes from the primitives — no literal values.
 - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the `ring` at 2px, no glow.
 - **Card** — `card` surface, 1px `border`, `radius`; shadow only on true overlays (`shadow-intensity` near zero); inset by `density-inset`.
 - **Table row** — `table-row-height`; faint `border` grid lines; `muted` on hover; `tabular-nums` on numeric columns; selection tints `accent`.
-- **Side panel** — detail and edit open in the side panel (`side-panel-width` / `side-panel-width-rich`), beside the work, not over it (floor P3).
+- **Side panel** — detail and edit open in the side panel (`side-panel-width` / `side-panel-width-rich`), beside the work, not over it (floor f03).
 - **Badge** — hairline `border`, `muted` / status fill, uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`.
 ## 5 Layout
@@ -97,7 +97,7 @@ hairlines, not `box-shadow`:
   lift, and even then a `border` does most of the separating.
 Focus is a monochrome `ring` outline (white on dark, near-black on light), never a glow, visible on
-every interactive element (floor P6). Three z-levels: content, sticky chrome, overlay.
+every interactive element (floor f06). Three z-levels: content, sticky chrome, overlay.
 ## 7 Do's & Don'ts
@@ -130,7 +130,7 @@ Directives the emitting agent follows verbatim:
   on a genuine overlay, and even then let the border lead.
 - Accent is monochrome contrast, not a hue. If two things want the primary, one of them is not primary.
 - Use one geometric sans (DM Sans / Inter) for everything; keep heading tracking tight-negative, weight
-  ≤ 600. `font-mono` for IDs and timestamps; `tabular-nums` on every numeric column (P4).
+  ≤ 600. `font-mono` for IDs and timestamps; `tabular-nums` on every numeric column (f04).
 - Uppercase micro-labels take positive tracking; small radius (4–16px), never pill.
 - **Stays behind:** full-bleed cinematic photography, the 48px hero display type, asymmetric editorial
   image grids, the 1600px cinema container, and photography-as-color. An operator surface earns its