Rootprint

Design System

This design system serves as the foundational layer for the TERRA+ prototype concept, enabling cohesive, scalable, and efficient design across the product experience. It supports rapid iteration while maintaining visual consistency and brand alignment.
View Prototype

Core Elements:

  • Branding: The system integrates our prototype’s distinct branding—logo marks, typography, iconography, and tone—ensuring a recognizable and cohesive identity across all UI surfaces.
  • Palette Theme: A thoughtfully crafted color palette forms the heart of the visual language. It includes primary, secondary, accent, and neutral tones that support both accessibility (WCAG compliant) and thematic flexibility, with light and dark modes defined.
  • Components with Variable Class Structures: All UI components are modular and built with flexible class structures. This allows for rapid styling changes and adaptation to new use cases, whether for interactive prototypes, production-ready UI, or future iterations. Components support a wide range of states, variants, and responsive behaviors, ensuring consistent interaction patterns throughout.
Return to Top
Branding
TERRA+
RootPrint
Theme
Color
trr-color-primary-main
trr-color-secondary-start
trr-color-accent-bg
trr-color-accent-bg
trr-color-text-main
Primary
main
#f5866c
start
#ffac98
end
#ff6d50
stroke
#e55f3f
focus
#e04723
Secondary
start
#fffefb
end
#faf4e8
stroke
#e7e0ce
focus
#ece9e4
Accent
bg
#d9e8c3
stroke
#b4d187
text
#88b04b
Text
main
#5e5f60
Typography
global-typo-header
global-typo-subheader
global-typo-body
global-typo-label
global-typo-bttn
Cabin
Header
Typography
Subheader
Typography
Body
Typography
Label
Typography
Button
Typography
Buttons
Primary
trr-bttn-primary
Login
Secondary
trr-bttn-secondary
Details
Icon
trr-bttn-icon
Inputs
Text
trr-input-label
trr-input-textfield
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Dropdown
trr-input-dropdown
Week 3 | May 12 – May 18
Checkbox
trr-checkbox
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Badges
trr-badge-primary
trr-badge-secondary
Primary Badge
Secondary Badge
Cards
Stats
trr-card-stat
Goal Progress
35.2 kg saved
Details
trr-card-details
Top Impact Contributors
🥗 Plant-Based Meals
Saved
6.4 kg CO₂
🔌 Unplugging Electronics
Saved
1.2 kg CO₂
Details