Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
Dpbm authored Dec 10, 2023
1 parent 73f0725 commit bfde302
Showing 1 changed file with 20 additions and 21 deletions.
41 changes: 20 additions & 21 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,49 +6,48 @@

## Install

After installing a Dark Reader to web browser of choice, we will be proceeding to setting up DR for Dracula theme.
After installing a Dark Reader to your web browser of choice, follow the steps bellow to add Dracula theme to your `Dark Reader`:

Click on "Dev Tools"
1. Click on "Dev Tools"

![devtools](./assets/devtools.png)

Enable "Preview new design" to unlock full potential of DR
2. Enable "Preview new design"

![newdesign](./assets/newdesign.png)


Click "See all options" so we can make actual changes, after that click on "Colors"
3. Click "See all options"

![custom_options](./assets/custom_options.png)

Set Dracula Theme hex values to following:
4. Click on "Colors"

4. set the following values:

Background --> `#282a36`
|Field|Value|
|-----|------|
|Background | `#282a36` |
|Text | `#f8f8f2` |
|Scrollbar --> custom | `#6272a4` |
|Selection --> custom | `#44475a` |


Text --> `#f8f8f2`


Scrollbar --> custom --> `#6272a4`


Selection --> custom: --> `#44475a`
<h2>Results should look like this:</h2>
### The final result should be something like this:

![colors](./assets/Colors.png)


## Optional
### Custom Font
Dark Reader also allows you to set custom fontsm that will be forced on websites.
To achieve this come back to "See all options", and then "Fonts & more".

Change "Change font" setting to Yes, then you will be able to change your fonts under "Font name".
Dark Reader also allows you to set custom fonts that will used on the websites you visit.

Drop down has a few default choices but you can manually type your font of choice, I've choose Inter.
To apply this, get back to "See all options", and then "Fonts & more".

Switch the "Change font" setting to `Yes`, then you will be able to change your fonts under "Font name".

![optional_font](./assets/optional_custom_font.png)
The drop down has a few default choices, but you can manually type your font of choice if you want.

![custom font](./assets/optional_custom_font.png)



Expand Down

0 comments on commit bfde302

Please sign in to comment.