Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

How to set to light mode by default?

default discord avatar
blankeos2 years ago
1

Themes = "light" | "system" | "dark"



I think theme is set to "system" by default in pref right? Is there any way to define that I want light mode to be default for all?

  • default discord avatar
    svn__2 years ago

    I don't think there is an easy way to set the default theme at the moment. Here you can find the main logic:

    https://github.com/payloadcms/payload/blob/master/src/admin/components/utilities/Theme/index.tsx

    I'd probably bypass this problem using:



    1. Custom provider

    https://payloadcms.com/docs/admin/components#custom-providers

    2. useTheme hook which you can import like that:

    import { useTheme } from 'payload/dist/admin/components/utilities/Theme';

    You should be able to set the theme in useEffect using

    setTheme

    function. It's my first idea and maybe there is a better way. If you will go with this solution remember to call

    setTheme

    only once (to allow users to change theme in dashboard settings,

    Automatic

    can be problematic and may require additional flag in localStorage)

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.