Brand YML and Dark Mode in Quarto
summary
Brand YML is a specification for consistent color, typography and logos and Quarto already implements it for HTML and Typst formats, with SCSS layering for HTML and a Typst CSS layer that maps CSS properties to Typst. Quarto 1.8 adds paired light and dark brands and a cell option to render first light then dark; Quarto 1.7 implements respect user color scheme. Matplotlib, Altair and Plotly outputs follow background and foreground colors via glue code in quarto, quarto-python, quarto-r and brand-yml, and the demos show plots switching correctly.
AI-written summary · about
related talks
20mStyling and Templating Quarto Documents
06mQuickly get your Quarto HTML theme in order
32mThe Dark Art of Designing for Dark Mode
18mDesigning and Deploying Internal Quarto Templates
27mThemeability is the path to dark mode
17mHTML and CSS for R Users
18mMaterial You & Figma: Bringing Dynamic Color & brand together
28mBuilding the Dark Mode of Your Dreams with Color Science