Components Color scheme switch
Petal Framework

Color scheme switch

A way for users to toggle light and dark mode.

Installation

Install the Javascript

For this to work the Javascript must be inline inside the <head>. If you try and load it from an external file there can be a flash of the wrong color scheme. eg if in dark mode it might flash white before turning dark.

<head>
  ...

  <.color_scheme_switch_js />
</head>

Ensure the hook is installed

If you’re using Petal Framework and have imported the hooks, it should work.

How to access

Membership
$299
-> 
See plans

This comes with the Petal Framework private hex package. Purchase a membership to get access to this package. It can be used with any Phoenix project. Post-expiration, you'll retain access but won't be eligible for updates from newer versions.