Tally Forms

Tally Forms

Preview image. Unlock full-res

white canvas, playful ink sketches

Industryproductivity
Palette
#37352f
#ffffff
#e0e0df
#898884
#777672
#000000
#45433e
#0070d7
#f81ce5
#fcadf6
#8a46ff

Tally Forms presents a lighthearted, yet highly functional workspace. Its design language blends clean, achromatic UI elements with playful, hand-drawn illustrations and a singular vibrant blue accent for primary actions. Surfaces are layered subtly with soft shadows, creating depth without heaviness. Typography is crisp and purposeful, maintaining readability amidst the visual whimsy. The overall experience is one of approachable productivity. Prioritize 'Tally Blue' #0070d7 for all primary interactive elements, ensuring strong visual hierarchy for actions. Use a 10px border-radius for all cards and container elements to maintain a consistent soft geometric aesthetic. Employ the multi-layered shadow rgba(0, 0, 0, 0.12) 0px 1px 1px 0px, rgba(61, 59, 53, 0.16) 0px 0px 0px 1px, rgba(61, 59, 53, 0.08) 0px 3px 9px 0px, rgba(61, 59, 53, 0.08) 0px 2px 5px 0px for elevated cards. Maintain 'White Canvas' #ffffff as the dominant background for all content areas, providing a clean foundation. Apply 'Inter' font with appropriate weights and sizes from the scale, ensuring text clarity and consistent letter-spacing of -0.0310em. Integrate playful Sketch Pink #f81ce5 for decorative accents, illustrations, or subtle highlights, contrasting with the neutral UI. Utilize 8px for most element gaps and element block padding around interactive controls for a comfortable density. Avoid using multiple chromatic colors for primary actions; reserve 'Tally Blue' #0070d7 for this role. Do not introduce strong, hard-edged shadows; maintain the soft, layered elevation style. Refrain from using sharp corners on interactive elements or cards; always apply a border-radius of 7px or 10px. Do not deviate from the Inter typeface; it is fundamental to the brand's typographic identity. Avoid excessive use of vivid accent colors; they should act as punctuation, not dominate the visual field. Do not use high-contrast borders on cards; elevation should primarily be conveyed through subtle box-shadows. Do not use generic or default system shadows; always apply the specified multi-layered shadows for cards.

More like this