Skip to content

Instantly share code, notes, and snippets.

@tvogt
Created June 18, 2025 07:49
Show Gist options
  • Select an option

  • Save tvogt/65bb6827a67d745fd88f4f30ce67a0bd to your computer and use it in GitHub Desktop.

Select an option

Save tvogt/65bb6827a67d745fd88f4f30ce67a0bd to your computer and use it in GitHub Desktop.
Unity UI Toolkit reset USS
/*
Unity's default theme includes colour and other elements going beyond mere basic formats
that are required if you want to use, say, ListViews or columns. Unfortunately, due to the specificity rule,
these will take precendence over your own styles. e.g. the .unity-button:hover:enabled will squash your
definition of .myButton:hover because it is considered "more specific".
This USS is a "reset" USS that clears those settings. You can simply include it as another stylesheet in your theme,
preferably the first (so it is overwritten by your own styles)
This is still INCOMPLETE. I add to it whenever I find something else that messes up my styling.
Feel free to add what you find.
*/
.unity-ui-document__root {
flex-shrink: 0;
width: 100%;
height: 100%;
}
.unity-content-viewport {
flex-grow: 1;
flex-direction: column;
}
.unity-button {
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
background-color: rgba(0, 0, 0, 0);
}
.unity-button:hover {
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
background-color: rgba(0, 0, 0, 0);
}
.unity-button:hover:enabled {
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
background-color: rgba(0, 0, 0, 0);
}
.unity-list-view__item:hover { background-color: rgba(0, 0, 0, 0); }
.unity-list-view__item:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item:hover { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item--selected { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item--selected:hover { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item--selected:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view__item--selected:checked { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-header__column:hover { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-header__column:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-view__row-container:hover { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-view__row-container:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-label:hover { background-color: rgba(0, 0, 0, 0); }
.unity-label:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-text-element:hover { background-color: rgba(0, 0, 0, 0); }
.unity-text-element:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-collection-view:focus:enabled .unity-collection-view__item--selected { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-view__header-container {
background-color: rgba(0, 0, 0, 0);
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
.unity-multi-column-header__column {
background-color: rgba(0, 0, 0, 0);
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
.unity-multi-column-header__column:hover { background-color: rgba(0, 0, 0, 0); }
.unity-multi-column-header__column:hover:enabled { background-color: rgba(0, 0, 0, 0); }
.unity-radio-button__checkmark {
background-color: rgba(0, 0, 0, 0);
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
.unity-radio-button__checkmark-background {
background-color: rgba(0, 0, 0, 0);
visibility: visible;
border-top-width: 0;
border-right-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment