This guide is still work in progress!
Spree Admin Dashboard stylesheet system is built in top Bootstrap and uses SASS preprocessor to compile custom stylesheets. To be precise we’re using DART-SASS (so you don’t need to install Node.js). You can find the stylesheets files in app/assets/stylesheets/spree/admin directory. The main entry point file is application.scss which uses SASS @import directive to include other stylesheets.

​
Overriding existing SASS code

This section will be added soon!

​
Adding custom CSS

Besides SASS you can still include standard CSS files. To do so:
  1. Create a new file in your application app/assets/stylesheets directory: 
    touch app/assets/stylesheets/custom_spree_admin.css
  2. Add some CSS rules to the file: 
    .custom-class {
  color: red;
}
  3. Create a template file in your application app/views/spree/admin/shared directory: 
    touch app/views/spree/admin/shared/custom_spree_admin_stylesheets.html.erb
  4. Use standard Ruby on Rails stylesheet_link_tag 
    <%= stylesheet_link_tag 'custom_spree_admin' %>
  5. Register this template in the Spree initializer (config/initializers/spree.rb): 
    Rails.application.config.spree_admin.head_partials << 'spree/admin/shared/custom_spree_admin_stylesheets'
That’s it! Now you’re custom CSS code will be included after loading the standard Admin stylesheets.