The McClatchy Email Design System (EDS) exists to provide visual alignment of our emails with the Saratoga Design System (SDS) and is organized with an atomic design structure. This system serves to streamline our email design workflow and provide consistency across all email products.
This section of the team website serves as both a style guide for the EDS as well as a code library of common elements and layouts.
EDS purpose and structure
how to use the EDS
links and information about HTML email
standard email framework
EDS buttons
EDS color palette
EDS fine print
EDS H1
EDS H2
EDS H3
EDS H4
EDS text links
EDS p
EDS small text
EDS spacing rules
EDS text modifier classes
download our app and app badges
large icon, subheading, body copy and button
how to work with multi-column layouts
how to create a zig-zag layout that collapses gracefully on mobile
shortcodes for Adobe Campaign that import dynamic content or personalization data
how to use if-else formatting to display content
email template for content marketing
email template for event promotion
email template for marketing offer
email template for newsletters