Search code examples
cssdisqus

How does Disqus's color scheme blend in with the host webpage?


I'm using Octopress, which uses Disqus for comments. I've recently switched from a light color scheme to a dark color scheme. To my pleasant surprise, Disqus manages to change its color scheme to blend in with the new theme. How does Disqus do that?


Solution

  • Here's a quote from their website:

    In Disqus 2012, both color scheme and link color are automatically selected based on your site's stylesheets. Additional information on how these elements are inherited can be found at Disqus 2012 Appearance Tweaks.

    And from the linked page above:

    A light or dark color scheme is automatically selected based on your site's stylesheets.

    How is the color scheme determined?

    • The light scheme is loaded when the text color Disqus inherits from your site has >= 50% gray contrast: between color: #000000 and color: #787878;
    • The dark scheme is loaded in all other instances.

    Instructions on how to override the inherited color scheme are also shown at the Disqus 2012 Appearance Tweaks page.