I am developing a SharePoint 2013 hosted app.
I would like to use in my app the color of the style site.
How can I retrieve the information of the style used by the site using JS?

  • Can you clarify your question a bit more? By default you inherit the master page and css from the host web. Apr 4, 2014 at 13:46
  • In my App I would like to keep the same color of the style of the site. (If the site has a blue theme in my app I will show blue css and so on)
    – Nk SP
    Apr 4, 2014 at 13:48

1 Answer 1


To use the host web's colours you'll need to dynamically load the host web's style sheet with some JavaScript. If you're using jQuery on the page, then you can use following block of JavaScript to inject the host web's style sheet onto your page.

(function () {
    // Retrieve the host web's URL from the query string
    var scriptbase = $.queryString('SPHostUrl') + '/_layouts/15/';

    // Create a <link> tag for the style sheet
    var $doclink = $('link').attr('rel', 'stylesheet');
    // The style sheet is loaded through an ASP.NET HTTP handler (defaultcss.ashx)
    $doclink.attr('href', scriptbase + 'defaultcss.ashx');

    // Add the style sheet link to the 

If that doesn't work, you can also check out Microsoft's article How to: Use a SharePoint website's style sheet in apps for SharePoint for an example that doesn't require jQuery.

  • How can I get only some css values from that file?
    – Nk SP
    Apr 4, 2014 at 14:39
  • I need the color of the class .ms-consoletoolbar (the top bar)
    – Nk SP
    Apr 4, 2014 at 14:56
  • Why not just add .ms-consoletoolbar class to the element? Then if you still need the color value you could read the color using jQuery .css() method on the element.
    – thm51mb
    Apr 4, 2014 at 14:58
  • I can not add the the default css file. I have my own css
    – Nk SP
    Apr 4, 2014 at 15:04
  • Hmm, maybe GetThemeShadeByName() is what you need? msdn.microsoft.com/en-us/library/office/…
    – thm51mb
    Apr 4, 2014 at 15:56

Not the answer you're looking for? Browse other questions tagged or ask your own question.