Storefront Theming
Customize the look and feel of your Renta storefront.
Each tenant can customize their storefront appearance through brand settings in the Dashboard. The storefront automatically applies these settings.
Brand Settings
Configure these in Dashboard → Settings → Brand:
| Setting | Description | Default |
|---|---|---|
primary_color | Primary brand color (hex) | #C4572A |
logo_url | Logo image URL | Renta logo |
business_name | Displayed business name | Tenant name |
tagline | Subtitle/tagline | — |
favicon_url | Custom favicon | Renta favicon |
How Theming Works
Brand settings are stored in the tenant's brand_settings JSONB column and returned by the Shop Profile endpoint:
const shop = await storefront.shop();
console.log(shop.brand_settings);
// {
// primary_color: "#C4572A",
// logo_url: "https://storage.getrenta.io/logos/mountain-adventures.png",
// business_name: "Mountain Adventures",
// tagline: "Explore the outdoors"
// }Custom Storefront Theming
When building a custom storefront, apply brand settings as CSS custom properties:
export function applyBrandTheme(brandSettings: {
primary_color?: string;
}) {
if (brandSettings.primary_color) {
document.documentElement.style.setProperty(
'--brand-primary',
brandSettings.primary_color,
);
}
}:root {
--brand-primary: #C4572A;
}
.btn-primary {
background-color: var(--brand-primary);
color: white;
}
.btn-primary:hover {
filter: brightness(0.9);
}
.link {
color: var(--brand-primary);
}
.badge-accent {
background-color: color-mix(in srgb, var(--brand-primary) 10%, transparent);
color: var(--brand-primary);
}Widget Theming
The embeddable widget accepts theme overrides via data attributes:
<script
src="https://getrenta.io/embed/widget.js"
data-tenant="your-slug"
data-container="renta-widget"
data-theme="dark"
data-primary-color="#8B4513"
async
></script>Your shop URL
Storefronts are served on the platform domain under /shops/{tenant-slug} (and related booking paths). Bring-your-own-domain is not wired to DNS yet; use your slug link from Dashboard → Settings or the marketplace shop list.
The public API base URL (api.getrenta.io) is unchanged regardless of how customers reach your shop.