My Firefox userChrome (made to match my startpage)

userChrome.css

/* Look into using https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/theme
   to make a custom theme. This would allow userChrome to be much smaller and less hacky. */

* {
    /* Color of tabs when loading */
    --tab-loading-fill: #808074 !important;
    /* Background color of navbar */
    --toolbar-bgcolor: #262626 !important;
    /* Color of icons on navbar */
    --lwt-toolbarbutton-icon-fill: #808074 !important;
    /* Color of line at top of tabs */
    --tab-line-color: #808074 !important;
    /* BGColor of top bar (where tabs are) */
    --lwt-accent-color: #262626 !important;
    /* Color of downloads button when completed
    --lwt-toolbarbutton-icon-fill-attention: #009933 !important;*/
    /* Background color of hovered navbar button */
    --toolbarbutton-hover-background: #80807450 !important;
    /* Background color of active navbar button */
    --toolbarbutton-active-background: #80808770 !important;
    /* BGColor of urlbar dropdown */
    --autocomplete-popup-background: #262626 !important;
    /* BGColor of selected item in urlbar dropdown */
    --autocomplete-popup-highlight-background: #80808770 !important;
    /* Color of selected item in urlbar dropdown */
    --autocomplete-popup-highlight-color: #cccccc !important;
    /* Color of non-selected items in urlbar dropdown */
    --autocomplete-popup-color: #cccccc99 !important; /* Opacity = 0.6 = 0x99 */
    /* BGColor of menus */
    --arrowpanel-background: #262626 !important;
    /* FGColor of menus */
    --arrowpanel-color: #cccccc !important;
    --urlbar-separator-color: #808074 !important;
    --facebook-color: #4167b1;
}

/* if the stuff under these doesn't work, re-enable and find a workaround
#userContext-label[value=Facebook] {
    color: var(--facebook-color) !important;
}

#userContext-label[value=Facebook] + .identity-icon-fence {
    fill: var(--facebook-color) !important;
}*/

.identity-color-toolbar {
  --identity-tab-color: var(--facebook-color) !important;
  --identity-icon-color: var(--facebook-color) !important;
}

/*
#connection-icon {
    /* get rid of the bright green lock icon by setting
       it to the same color as all the other icons 
    fill: var(--lwt-toolbarbutton-icon-fill) !important;
}

/* Make the identity label not bright green 
#identity-icon-labels {
    color: var(--lwt-toolbarbutton-icon-fill) !important;
   
}*/

/* Get rid of the "search for <xyz> with..." text and icons at the bottom
   of the urlbar dropdown. */
.search-panel-one-offs-header {
    display: none !important;
}
.search-panel-one-offs {
    display: none !important;
}

/* Change the font of the results in the urlbar dropdown */
#urlbar-results {
    border: none !important;
    font-family: "Fira Code" !important;
    font-size: 12px !important;
}

/* URL/search box */
#urlbar {
    /* keeps the box from doing wonky things since I added a border to it */
    min-height: 28px !important;
}

/* The little "Search with <Engine>" text next to search suggestions */
.urlbarView-action {
    display: none !important;
}

/* Row containing a result in the urlbar dropdown */
.urlbarView-row {
    border-radius: 0 !important;
}

/* The little icon for your search engine next to search suggestions */
.urlbarView-favicon[src^="moz-extension"] {
    filter: sepia(85%) !important;
}

/* The little favicon for each website next to suggestions */
.urlbarView-favicon[src^="page-icon"] {
    filter: sepia(85%) !important;
}

/* Replace the em-dash thing after each search suggestion */
.urlbarView-title-separator:before {
    content: "->" !important; /* with fira code ligatures this looks better */
}

/* Stupid little blank space before the first tab (when floating) */
.titlebar-spacer[type="pre-tabs"] {
    width: 0 !important;
}

/* Tab icons */
.tab-icon-image {
    filter: sepia(85%);
}

/* The label of every tab (particularly the background ones, in this case) */
.tab-label {
    opacity: .6;
}

/* Foreground tab label */
.tab-label[selected] {
    opacity: 1.0;
}

/* The little | between buttons on the far right of the urlbar */
#pageActionSeparator {
    display: none;
}

/* Extension icons on the toolbar */
.webextension-browser-action {
    filter: sepia(85%);
}

/* Tabs */
.tabbrowser-tab {
    color: #cccccc !important;
}

/* Toolbar */
.browser-toolbar, #nav-bar {
    font-family: "Fira Code" !important;
    box-shadow: none !important;
}

/* Address/search box */
#urlbar, .searchbar-textbox {
    border: 2px solid #808074 !important;
    border-radius: 0px !important;
    background-color: transparent !important;
    color: #cccccc !important;
    box-shadow: none;
}

/* The button to bookmark stuff */
#star-button-box {
    display: none !important;
}

/* The button to close tabs */
.close-icon {
    fill: #808087 !important;
}

/* min/maximize/close buttons */
.titlebar-button {
    color: #cccccc !important;
    stroke: #cccccc !important;
}
.titlebar-button:hover {
    background-color: #80807450 !important;
}

/* Specifically the close button */
.titlebar-close:hover {
    background-color: #6F1616 !important;   
}

/* The little "Go" arrow that shows up in the URL bar when you put something in it */
.urlbar-go-button {
    display: none !important;
}