Theme Config

Customisation of the Auth UI is achievable through the theme config.

Interface

export type ThemeConfig = {
  theme: 'dark' | 'light';
  defaultAuthOption?: 'web3' | 'custodial';
  colors: {
    primaryColor: string; //Hex code
    socialPrimaryColor: string;
    socialSecondaryColor: string;
    secondaryColor: string;
    backgroundColor: string;
    borderColor: string;
    textColor: string;
  };
  images?: {
    backgroundImage?: string;
    logo?: string;
  };
};

Overwrite theme objects

Example:

import { DarkTheme } from '@futureverse/auth-ui';
import type { ThemeConfig } from '@futureverse/auth-ui';

const customThemeConfig: ThemeConfig = {
  ...DarkTheme,
  defaultAuthOption: 'web3',
  images: {
    logo: '<optional logo svg / image>',
    backgroundImage: '<optional background image>',
  },
};

All color values only accept hex codes.