If you need more control over the customization of your pages on itch.io youcan request access to the CSS editor. CSS customization must be enabled on aper-account basis.

Please review this entire guide before requesting CSS access. We do notgrant CSS access to empty accounts. Instructions are located on the bottom ofthis page.

The CSS editor is available on:

• Project pages (Including Devlog posts)
• Jam pages
• Profile pages

Introduction

The CSS editor lets you control how your pages look outside of what thebuilt-in theme editor allows. Keep in mind we sometimes upgrade itch.io’spages and it’s difficult to ensure those changes don’t conflict with yourcustom CSS.Enhancing existing components instead of trying to redo theentire page is the best way to avoid any problems.

The CSS classes and IDs listed on this page should be considered stable and youcan use them for targets to your customization. Use any other CSS classes atyour own risk, future updates to itch.io may not be compatible with your CSS.We'll do our best to be conservative about changes, but sometimes we have tomake them. If we make major changes, we'll try to email all CSS users about theupdates.

CSS generated by the itch.io theme editors is applied using CSS classes, so youcan use ID selectors to have your style take higher precedence.

Considerations

Custom CSS is a powerful tool, but can also degrade the quality of the page.Please keep the following things in mind when designing your page.

• Don’t forget about web accessibility, those with disabilities or assistivetechnologies should have no trouble accessing the page.
• Project pages are built for mobile web, please test your CSS againstsmaller viewports.
• Test your custom CSS logged out to ensure any changes to page are compatible with your CSS.
• Attempting to trick visitors into performingactions they didn’t intend will get your CSS access (and maybe your account)suspended.

Custom classes

The content you provide for your pages (project, profile, jam, etc.) supports asubset of HTML. If you'd like to target elements in your markup with custom CSSyou can give them a class. In order to prevent conflict with itch.io’s own CSS,classes you use must begin withcustom-. Any other classes you provide willbe stripped by the sanitizer.

To access HTML mode in our rich text editor, you can click the<> button.Once you start writing HTML with the rich text editor then we recommend onlyediting as HTML, as the rich text editor may rewrite your markup and strip tagsyou have added.

Project page layout

Please place all your custom rules inside of#wrapper to avoid breaking oraltering itch.io core functionality.

Embedded games

Project pages that have embedded content (HTML5, Flash, etc.) have the same layout above, but with an additional element inserted above.columns:

External content

If you need to reference external resources (images, fonts), you should makesure they're hosted into a reliable place with support for HTTPS. You can embedimages and fonts directly in your CSS by Base64 encoding it.

Getting CSS access

If you would like CSS access on your account then pleasecontact us.

Please tell us what kinds of changes you'd like to make to your page. Werestrict access to the CSS editor by default because it makes it harder for usto upgrade game pages on itch.io without breaking custom layouts, additionallywe expect you to use CSS responsibly.

In your message:

• Please ensure that what you're trying to accomplish can’t already be done with the built in theme editor.
• Briefly describe the types of changes you would like to make.
• Confirm that you are aware that you must ensure that your page remains accessible. Do not use CSS in a way that makes your pages difficult to operate or read.
• Confirm that you will not alter itch.io’s built in UI with your CSS and that you will scope all changes only to the visuals of your page content.