Preply

This system feels like a vibrant, welcoming learning space, merging playful energy with professional clarity. The dominant 'Tutor Pink' background of the hero immediately signals a dynamic, approachable brand. Typography uses a distinctive contrast: the custom 'Platform' font for headlines with tight letter spacing creates punchy, impactful statements, while 'Figtree' provides warm, readable body copy. Subtle 4px and 8px radii are used sparingly on functional elements, maintaining a crisp aesthetic. Use 'Tutor Pink' (#ff7aac) exclusively for hero backgrounds or significant brand statements. Apply 'Platform' font for all headings, using weights 600 or 700 with letter-spacing adjusted per size for visual impact. Maintain 'Figtree' font for all body text, links, and functional labels, typically at 400 weight for readability. Utilize 'Blackboard Ink' (#121117) for primary text and main navigation elements, ensuring strong contrast. Ensure interactive components like buttons and cards consistently use 4px or 8px border-radii for subtle softening. Use padding: 0px 24px for primary call-to-action buttons for consistent horizontal spacing. Employ 'Outline Gray' (#dcdce5) for subtle borders on interactive elements to provide definition without harshness. Avoid using shadows on cards; the design relies on background color shifts and borders for separation. Do not deviate from the core color palette. Introducing new chromatic colors will dilute the brand identity. Do not use generic system fonts; 'Platform' and 'Figtree' are critical to the typographic brand. Avoid excessive rounding; limit border-radius to 4px or 8px on specific interactive elements, not general containers. Do not use letter-spacing on 'Figtree' body text that deviates from its inherent values, as this compromises legibility. Do not use padding: 0px for buttons, unless it is a pure text link button with no background.