ActiveSkin gem provides an easy way to customize Active Admin CSS depending upon your website's color scheme in just few minutes.
Steps:
1/ Add to your Gemfile:
gem 'active_skin'
2/ Run:
bundle install
3/ Add to active_admin.css.scss:
//Add the Website's logo. This is displayed on the top-left corner of the page. $skinLogo: url("logo.png") no-repeat 0 0; //This color is applied to buttons, drop-down lists etc. in the AA UI $skinActiveColor: #05B6C7; //Applied to the main header of Active Admin $skinHeaderBck: #000000; //Applied to the header of AA filters. $panelHeaderBck: #000000; @import "active_skin";
Sample image of implementation of Active_skin:
Github link to this gem: [ActiveSkin][1]
[1]: https://github.com/rstgroup/active_skin