Add a skin

Learn what a custom skin is and how to use one for your space with a custom domain.

What is a skin?
A skin is a custom color scheme which you can use for your space if it has a custom domain set up. The customization will be visible only on the custom domain and will not affect the color scheme of your space on https://snapshot.org.
If you haven't setup a custom domain yet, head to Add a custom domain to learn how you can do it. 
Add a skin to your space
Head to your space settings on Snapshot and find the Custom domain section. 
Select a skin by scrolling through the list of available choices or by typing the name you are looking for. If none of them work for you, you can create a custom skin following the section below: Create a custom skin 
Don't forget that the skin will only be applied to the custom domain URL!
Snapshot skin selector.
That's it! You should be able to see the custom color scheme for your space on its custom domain  🎉
​
Create a custom skin
1. Fork the snapshot-spaces repository
Create a fork of the snapshot-spaces repository:
GitHub - snapshot-labs/snapshot-spaces
GitHub
2. Add the styling for your space
Create a new file in the skins directory following the my-space.scss naming convention:
└── skins
    └── my-space.scss
Add your custom scss to the newly created file. The class name .my-space should match the filename you created. Make sure that you edit only the values (i.e. #384aff on the right-hand side and do not change the properties (i.e. --primary-color). 
.my-space {
  --primary-color: #384aff;
  --bg-color: white;
  --text-color: #586069;
  --link-color: #111111;
  --heading-color: #111111;
  --border-color: #d1d5da;
  --header-bg: white;
  --block-bg: transparent;
}
Don't forget to change the file name my-space.scss and css selector .my-space to your space name.
You can have a look at a custom skin example by following this link.
3. Import the scss file 
Add the import of your newly created scss file to the skins/index.js file in the following format:
import my-space from "./my-space.scss";
4. Create a pull request
Create a Pull Request with the above changes on the original snapshot-spaces repo.
The review can take the team up to 72 hours, so please be patient 🙏
​
After the PR has been merged, you will need to wait for the release of a new version of Snapshot which can take a couple of days. Once it's deployed you can move on to the next step.
5. Update your space settings
Follow the steps from Add a skin to your space to use your own custom skin.

Add a custom domain

Space roles

Last modified 4mo ago