Build your own theme with a company logo!

1. Select your color



2. Choose your company logo



Minimum height: 40px

Preferred type: Transparent PNG

Preferred size: up to 10KB

 
So you love Jenkins but hate its ugly user interface and icons Me too! Introducing Jenkins Material Theme. You can turn your favorite frog CI tool into a handsome prince in few steps! Install this Jenkins Theme!

Features



Just one small css file (35K)

Embed minified SVG images

Multiple ways to install

Screenshots


Screenshot jenkins-material-theme main Screenshot jenkins-material-theme legendScreenshot jenkins-material-theme consoleScreenshot jenkins-material-theme history

Installation




Choose your color: image  


Replace `` in the URL by the chosen color: https://cdn.rawgit.com/afonsof/jenkins-material-theme/gh-pages/dist/material-.css
 


Install Jenkins Simple Theme Plugin
 


Click Manage Jenkins
 


Click Configure System and scroll down to Theme
 


Set the CSS field to the generated URL.
 


Click Save
 

Using your Jenkins Hosting




Follow the step 1 and 2 of the previous method
 


Download the generated URL
 


Upload the downloaded file to your web server
 


Follow the steps 3 to 7 of the previous method using your uploaded file as URL in step 6
 

Using Stylish (only you will be able to see the awesome theme)




Follow the step 1 and 2 of the previous method
 


Copy the content of the file downloaded file
 


Install the Stylish Chrome extension
 


Go to Stylish options and click in Write new style
 


Paste the theme css in the code box
 


Click in Specify and set your jenkins domain
 


Click in Save
 


Go to your Jenkins website and enable the theme in the Stylish Chrome toolbar icon
 

Development


CSS file are minified and compressed with Grunt. To prepare the environment:

npm install
grunt


This will generate the following file:


dist/material-light.css

Compatibility




Simple Theme plugin 0.3
 


Jenkins 1.636
 


Firefox 3.5+
 


Chrome 4+
 


Safari 4+
 


Opera 15+
 


Microsoft IE11 and Edge
 


If you are experiencing issues please let me know! Also, feel free to contribute!

License


http://afonsof.mit-license.org/

Thanks to




Simple Theme Plugin for the Simple Theme plugin
 


Google for the the material design inspiration and the icons
 


Material Design Icons for some extra icons
 


Stylish for making the test of new versions easy
 


canon-jenkins for the base theme
 


@Heldroe for Firefox and Microsoft support