Sunday

Sunday

Say hello to Memo. Built for busy households, Memo works 24/7 to make your life lighter. Hand off your endless to-do’s, so you can focus on what really matters.

4.0
6
Visits
Visit

Available Pages

Version History

Design Analysis

Sunday Home design analysis

Robotic Editorial Calm is a hardware-marketing system that builds trust through stillness. Large quiet headlines, pale material fields, and tactile imagery do most of the persuasion, while darker technical chapters arriv...

Key Takeaways

  • Primary ( 1F2322): main text and dark action color.
  • Secondary ( D7E0DB): calm technical backdrop.
  • Tertiary ( EEDB3C): tiny observational signal.
  • Display: very large, sparse, and low-drama.
  • Body: concise, explanatory, and calm.
  • Labels: minimal, mostly for navigation or tiny metadata.

Overview

Robotic Editorial Calm is a hardware-marketing system that builds trust through stillness. Large quiet headlines, pale material fields, and tactile imagery do most of the persuasion, while darker technical chapters arrive only when the story needs more precision.

Image Direction

Use large product photography, domestic-use scenes, and occasional isolated hardware renders. Images should feel tactile and useful, not sci-fi theatrical. The best compositions place the device inside real life, then later isolate it for clarity.

Colors

The palette is quiet and material-led.

  • Primary ( 1F2322): main text and dark action color.
  • Secondary ( D7E0DB): calm technical backdrop.
  • Tertiary ( EEDB3C): tiny observational signal.

Typography

Use a clean editorial sans with lots of breathing room.

  • Display: very large, sparse, and low-drama.
  • Body: concise, explanatory, and calm.
  • Labels: minimal, mostly for navigation or tiny metadata.

Design.md

System Overview

Core identity and authoring metadata from the refto.one design model.

Robotic Editorial Calm

A calm robotics-marketing system built from sparse type, pale fields, large product imagery, and chaptered editorial pacing.

Quiet, credible, and gently futuristic.

Primary mode: light-dark mixedhardware product marketingexperience-led

Theme

Fields outside the primary renderer remain visible here as structured fallback content.

Visual atmosphere
Summary
Quiet, credible, and gently futuristic.
Density
3
Variance
5
Motion
4
Signals
pale neutral field · giant sparse typography · human-scale hardware imagery · slow editorial chaptering

Colors

Primitive palettes and resolved token colors for the active preview mode.

Palette colors
Paper White
#F7F5F0
Soft Sage Mist
#D7E0DB
Graphite Text
#1F2322
Night Section
#272D2C
Signal Yellow
#EEDB3C
Quiet Border
rgba(31,35,34,0.10)
Usage rules
Keep most of the system calm and pale.
Use dark chapters sparingly for technical contrast.
Use yellow only as a tiny observational cue.

Token Spacing

Spacing scales rendered as tokens with a simple length specimen.

section_gap
clamp(5rem, 10vw, 9rem)
group_gap
1rem
card_padding
1.25rem

Token Radii

Corner radii tokens with a live surface sample.

control
999px
component
0.75rem
container
1rem

Typography Families

Font families from the current design YAML, including fallback stacks and usage character.

Display
Suisse Int'l
clean editorial sans with lots of air
Body
Suisse Int'l
calm explanatory voice
Mono
Suisse Int'l
single-family restraint

Typography Scale

Top-level typography scale rendered as live text specimens.

Display
clamp(3.5rem, 9vw, 7rem)/—
Display
H2
clamp(2rem, 5vw, 3.5rem)/—
H2
Body
1rem/—
Body
Caption
0.8125rem/—
Caption

Typography Rules

Fields outside the primary renderer remain visible here as structured fallback content.

Rules
Use generous whitespace around headlines. · Keep body text concise and observational. · Avoid aggressive weight changes or decorative display effects.

Motion

Motion tokens rendered as resolved values for timing and personality.

Duration
180ms-260ms
Easing
cubic-bezier(.22, .8, .22, 1)
Spring
stiffness 100, damping 22

Motion

Resolved motion token values.

PropertyValue
duration180ms-260ms
easingcubic-bezier(.22, .8, .22, 1)
springstiffness 100, damping 22

Layout Principles

Use large quiet image chapters.
Let headlines float in open space before the next proof block arrives.
Alternate domestic-use scenes with technical explanation.
Keep chrome minimal and centered around one stable nav bar.

Component Preview

Low-complexity component tokens rendered as design-system specimens.

Buttons primary
Base Attributes
Background
#1F2322
Text
#F7F5F0
Border
1px solid #1F2322
Radius
{tokens.radii.control}->999px
Padding
0.75rem 1rem
Min height
40px
Typography
caption
Buttons secondary
Base Attributes
Background
rgba(255,255,255,0.72)
Text
#1F2322
Border
1px solid rgba(31,35,34,0.10)
Radius
{tokens.radii.control}->999px
Padding
0.625rem 0.875rem
Min height
36px
Typography
caption
Cards media
Feature Card
Component preview content
Base Attributes
Background
#F7F5F0
Text
#1F2322
Border
none
Radius
{tokens.radii.component}->0.75rem
Padding
0
Shadow
none
Cards dark chapter
Feature Card
Component preview content
Base Attributes
Background
#272D2C
Text
#F7F5F0
Border
none
Radius
0
Padding
0
Shadow
none

Scroll motion

Schema-agnostic optional blocks from the design YAML. New option keys render here automatically.

Summary
Use slow chapter pacing and sticky transitions to guide the story between domestic life and technical proof.

Image direction

Schema-agnostic optional blocks from the design YAML. New option keys render here automatically.

Summary
Let large photography and isolated hardware renders carry most of the emotional weight.

Responsive guidance

Schema-agnostic optional blocks from the design YAML. New option keys render here automatically.

  • -
    Preserve the calm large-image rhythm on mobile by reducing section count before reducing image scale too far.
  • -
    Keep headlines spacious, even when line breaks multiply.

Anti Patterns

Compact list of patterns the design system explicitly avoids.

  • -
    No loud consumer-fintech gradients.
  • -
    No dense dashboard grids.
  • -
    No overly glossy product renders floating in empty hype space.
  • -
    No condensed or aggressive typography.
  • -
    No decorative motion that overwhelms the hardware proof.