Skip to main content

🎨 Theming & Branding

TriviaFlow is designed to be "White Label" friendly. You can adapt the look and feel to your event or brand.

1. UI Language (i18n)

Out of the box, we support English (en) and German (de).

  • Change Language: Set UI_LANGUAGE=de in your .env file.
  • Override Texts:
    • Create a file triviaflow/quiz/texts/custom_en.py.
    • Add a dictionary TEXTS = { "KEY": "Your Text" }.
    • See quiz/texts/en.py for all available keys.

2. Custom CSS (Lobby & Player)

You can inject your own CSS to change colors, fonts, or backgrounds without touching the core code.

  1. Create triviaflow/quiz/static/quiz/css/custom.css.
  2. Add your standard CSS.
    /* Example: Change background color */
    body {
    background-color: #1a1a2e !important;
    }
    .btn-answer {
    border-radius: 50px;
    }
  3. The system automatically loads this file if it exists.

3. Admin Panel Theme

The admin dashboard uses django-unfold (Tailwind CSS based).

  • Primary Colors: You can adjust the Tailwind color palette in settings.py under the UNFOLD configuration.
  • Logo: Replace static/admin/logo.svg to change the dashboard branding.