diff --git a/README.md b/README.md index fbec04628a..c11b408c37 100644 --- a/README.md +++ b/README.md @@ -48,25 +48,28 @@ Install [Stylus](https://github.com/openstyles/stylus) for your browser by click > [!TIP] > If you use Chrome, make sure to enable "Allow access to file URLs" in the Stylus extension settings. -### All Userstyles +### All Userstyles (recommended) See instructions on the [GitHub release page](https://github.com/catppuccin/userstyles/releases/tag/all-userstyles-export). ### Individual Userstyles -1. Enable CSP Patching from `Stylus Settings` > `Advanced`. -2. Install the theme: - - `https://github.com/catppuccin/userstyles/raw/main/styles//catppuccin.user.css` - - Replacing `` with the name of the userstyle. +1. Enable CSP Patching from Stylus's **Settings** > **Advanced**. +2. Install userstyles by clicking the **Stylus Install** badge in each README. 3. Enjoy! -> [!TIP] -> For decentralized or self-hosted applications, you can apply a theme to one or multiple instances across updates by following the instructions below. -> -> 1. Open the Stylus "Manage" page. -> 2. Click on the userstyle's name in the list. -> 3. Click on **Style settings** in the left panel. -> 4. Enter the URL patterns for your instance(s) in the text box labeled **Custom included sites**. +## Usage + +All usertyles come with three default configuration options; the light flavor, the dark flavor, and the accent color. Some userstyles may offer additional site-specific options as well. + +### Decentralized/self-hosted applications + +For decentralized or self-hosted applications, you can apply a theme to one or multiple instances across updates by following the instructions below. + +1. Open the Stylus "Manage" page. +2. Click on the userstyle's name in the list. +3. Click on **Style settings** in the left panel. +4. Enter the URL patterns for your instance(s) in the text box labeled **Custom included sites**. For example, to apply a userstyle to `example.org`, you would add a line with `https://example.org/*` to the textbox. The trailing asterisk applies it to all pages on the domain - without it, only the root page is themed.