The Design section in the Settings panel allows you to personalize the appearance of your Timeline to match your website's branding.
When you first add the Timeline widget to your site, it automatically adapts to your site's existing theme — picking up your fonts, colors, and styles. There are no hardcoded default colors or styles. Everything inherits from your Wix site theme out of the box.
If you want to customize further, the Design section gives you control over four elements:
Title — The font style and color of event titles.
Details — The font style and color of event descriptions, time, and location text.
Category — The color of the category badge on each event card.
Card — The background color of the event card containers.
Color Picker options:
Theme colors — Choose from your site's existing theme color palette. You can also add custom colors to "My colors" for reuse.
Advanced Settings — Connect the element to a site theme color default (e.g., Primary background, Titles, Body text, Links & actions, etc.) so it automatically updates if you change your site theme.
Custom Color — Pick any color using the color spectrum, or enter a precise value using HEX, RGB, or HSB. An eyedropper tool is also available to pick a color directly from your page.
Font Picker options (Title and Details):
Style — Choose from preset styles (e.g., Large body, Small body) or select "Custom" for full control.
Fonts — Browse from "My Fonts" or "All fonts." You can also upload custom fonts or add language-specific fonts.
Font size — Adjust the size in pixels using the slider or by entering a value directly.
Formatting — Apply Bold, Italic, or Underline to the text.
Tips:
If you want the Timeline to always match your site theme automatically, use the Advanced Settings color options to connect elements to your site's color defaults.
Use 2–3 fonts across your site to keep it looking clean and professional.
Keep font sizes balanced — a larger title with smaller details creates a clean visual hierarchy.
Don't forget to publish your site after making design changes so they appear on your live website.