Global appearance
Navigate to the Appearances
tab of your RealtyVis Dashboard. From there, you'll find options for Font, Theme, Custom options and Map tile.
Font
Font family
The fonts available are from a list of Google Fonts. In general, you'd want to match the base font family you're using for your main website. If you need to preview what each font looks like, you can use the Google Fonts online tool.
Font size
Font size controls the base font size unit for all RealtyVis blocks. You can use absolute units such as px
or relative units such as %
, em
or rem
.
A lot of the sizing in RealtyVis are based on the base font size. For example, if you increase the font size, you'll also increase the size of the buttons, popups, and spacing between elements.
Theme
There are a selection of light and dark themes to choose from. Each theme comes with it's own default settings for primary colour, secondary colour, background colour and rounded buttons that you can further customize.
If you choose a dark theme, you'd want to make sure the container you're placing the RealtyVis block into also has a dark background color because the area surrounding the block elements have transparent backgrounds, regardless of light or dark theme.
Custom styling
We encourage you to use the custom styling options to override the preset themes. This gives you more flexibility to set the appearance that matches your website branding. Set the primary and secondary colours of your branding visual elements and the background colour for cards and popup windows.