Screenshot of Loops

Loops

loops.so

The reference for editorial-serif email platform — cream + black + classic article underlines, Framer page builder, AI agent sub-product positioning.

Marketing Platform Email Platform strong

Design tokens

cream
black
white
display
Editorial serif (Times fallback indicates serif intent — actual face is Framer-loaded)
body
(sans-serif fallback)
mono
(none on captured page)

Do / Don't

Reference it for

  • Editorial serif-only typography (Caslon / Garamond / similar)
  • Cream #fafaf9 page + pure black text — quietly editorial palette
  • Classic article-link underlined emphasis in lede (product / marketing / transactional)
  • Black filled pill CTA with outline secondary
  • 6 AI-agent-specific keyframes (agentPromptGlow / agentPulseDot / agentFadeReveal / agentLineReveal / agentButtonReveal / agentSweepAcross) — extensive AI demo motion vocabulary
  • Smooth easing curve cubic-bezier(0.16, 1, 0.3, 1) at 0.3s
  • Human / Agent (Soon) tabs for human-vs-AI workflow positioning
  • Triggers / Branching / Playbooks pill chips for workflow primitives

Do not copy

  • The Loops logotype
  • The "One platform, every email" copy
  • The 308 @font-face Framer setup
  • The Framer page builder unless using Framer
  • The agent-specific keyframe names (Loops-specific brand vocabulary)

Signature moves

editorial serif with article-link underlines

editorial serif-only typography (Caslon/Garamond-style) on a cream #fafaf9 ground with pure black text uses classic article-link underlined emphasis in the lede (product / marketing / transactional)

AI-agent demo keyframe vocabulary

six AI-agent-specific keyframes (agentPromptGlow / agentPulseDot / agentFadeReveal / agentLineReveal / agentButtonReveal / agentSweepAcross) form an extensive AI-demo motion set on a smooth cubic-bezier(0.16,1,0.3,1) at 0.3s, plus an npm code-snippet shimmer

Related references

Screenshot of Lattice

Lattice

strong

Hr Platform

The reference for HR/People platforms with rainbow-gradient personality — deep teal text on cream, pastel feature cards, multi-coloured wave logo, Matter at fractional rem-math sizes.
Screenshot of Loom

Loom

flagship

Saas Product

a post-Atlassian-acquisition SaaS site (now branded "Atlassian Loom") built in Next.js, set in Atlassian's Charlie Text + Charlie Display, anchored by a single Atlassian-blue `#1868db` CTA and a hero video thumbnail that doubles as the product demo - the canonical reference for "absorbed-by-enterprise SaaS that still feels like itself."
Screenshot of Slack

Slack

flagship

Saas Product

a post-Salesforce-acquisition product flagship where the iconic aubergine `#611f69` survives as the primary CTA, Salesforce-Sans replaces Lato, and a 30-keyframe motion library powers the "workspace-people-bump" avatar animations that have always been Slack's brand signature.
Screenshot of Adaline

Adaline

strong

Developer Tool

an AI-infra product site that swaps the genre's default dark-neon for a hand-built 3D Japanese-garden world, then runs warm earth tones, a grotesque/mono type pair and patient scroll-reveal motion over the top so a developer tool feels like a calm place.