ActiveSkin gem provides an easy way to customize Active Admin CSS depending upon your website's color scheme in just few minutes.


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]