Fiverr.com

Fiverr.com projects a workaday, accessible design system with a sharp focus on clarity and function. The visual style is rooted in a dominant, slightly desaturated green brand color used for accents and action, set against a predominantly achromatic palette of white, grays, and dark graphite surfaces. Interface elements are compact, utilizing soft curves and minimal elevation to maintain a lightweight feel, emphasizing direct interaction without visual clutter. The overall impression is one of efficiency and straightforward professionalism, guiding users through a clean, task-oriented experience. Use Graphite (#222325) for primary text on light backgrounds and Cloud White (#ffffff) for primary text on dark backgrounds to ensure high contrast. Apply Fiverr Green (#1dbf73) exclusively for interactive elements like links and active states, or for decorative accents, to signal interactability and brand presence. Maintain a clear element gap of 12px for consistent vertical and horizontal rhythm between most UI components. Utilize 16px border-radius for cards and 8px for buttons to maintain a consistent, slightly softened aesthetic without appearing overly rounded. Implement Macan typeface with text-align: left for body text and text-align: center for hero headlines, leveraging its versatility for content hierarchy. Apply the card shadow rgba(0, 0, 0, 0.13) 0px 3px 10px 0px consistently to cards for a subtle lift off the page. Prioritize Cloud White (#ffffff) for main page and card backgrounds to establish a light theme canvas, contrasting with Deep Moss (#003912) for hero sections and feature blocks. Do not use Fiverr Green (#1dbf73) as a background for large sections or containers, as its vividness is reserved for accents. Avoid using multiple distinct colors for primary call-to-action buttons; stick to the specified outlined white or subtle filled graphite for actions. Do not use text weights below 400 for body copy on light backgrounds, as the system favors legibility over excessive lightness. Refrain from introducing additional shadow styles; adhere to the defined card shadow for all elevation needs. Do not use highly saturated colors for borders or backgrounds of primary UI elements; maintain a neutral base with controlled green accents. Avoid using inconsistent spacing values; always refer to the defined elementGap, cardPadding, and sectionGap tokens for predictable layouts. Do not alter the Macan typeface letter spacing; apply -0.0600em only at 72px and -0.0300em at 48px, keeping normal spacing for smaller text sizes.