SiteStyleGuide

Unofficial A style guide made by SiteStyleGuide from shopclues.com’s public web pages. Not affiliated with or endorsed by shopclues.com. The real site is shopclues.com ↗

Unofficial style guide

shopclues.comstyle guide

shopclues.com’s website (shopclues.com) uses Open Sans for its headings and body text. Its palette is led by Cadet Blue (#24A3B5), Sandy Brown (#FF934B) and Salmon (#FF5E62), with #555555 text on #EFF7FA. Captured from the live site on 29 October 2026.

Typefaces
Open Sans, Arial, Roboto
Palette
4 neutrals, 12 colours, 3 gradients
Captured
29 Oct 2026 · added by @sitestyleguide
https://www.shopclues.com/ Screenshot
Screenshot of the shopclues.com homepage on a desktop screen
Screenshot of shopclues.com on a 1440 px desktop screen, 29 Oct 2026.

Identity & metadata

What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.

Title &
description

Page title
Online Shopping Site India - Shop Online for men, women and kids fashion, home, kitchen, health, sports and more products at ShopClues
▲ 134 / 60 characters
Meta description
Online shopping site in India - Shop Online for men, women and kids fashion, home décor and furnishings, kitchen apppliances, health and sports products at best prices from ShopClues. Easy Return & Replacement Policy!
▲ 217 / 160 characters
Site name
shopclues.com
og:title
Online Shopping Site India - Shop Online for Mobiles, Electronics, Clothing & More at ShopClues
og:description
Online shopping site in India - Buy mobiles, electronics, laptops, home appliances, fashion, shoes, home & kitchen products at the lowest prices from Shopclues.com. Easy Return & Replacement Policy!

In search results

shopclues.comhttps://www.shopclues.com/

Online Shopping Site India - Shop Online for men, women and k…

Online shopping site in India - Shop Online for men, women and kids fashion, home décor and furnishings, kitchen apppliances, health and sports products at best …

When shared

No og:image, so no picture

shopclues.com

Online Shopping Site India - Shop Online for Mobiles, Electronics, Clothing & More at Sho…

Online shopping site in India - Buy mobiles, electronics, laptops, home appliances, fashion, shoes, home & ki…

Back to top ↑

Colour

Read from the site’s stylesheets and weighted by where each colour is used. Names are the nearest standard colour name. Click a swatch to copy its hex code.

Contrast is against the site’s text colour (#555555) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used
  • White 29%
  • Grey 12.8%
  • Near Black 11.6%
  • Cadet Blue 11.5%
  • Dark Grey 7.7%
  • Sandy Brown 5.8%
  • Salmon 5.7%
  • Dark Orange 3.7%
  • Medium Sea Green 1.7%
  • Light Sky Blue 1.7%
  • Deep Orchid 1.7%
  • Indian Red 1.4%
  • Gold 1.4%
  • Light Orchid 1.4%
  • Spring Green 1.4%
  • Yellow 1.4%

By how often each colour appears in the site’s CSS, weighted by where (body, headings, buttons), not by area on the screen.

Neutrals

Text, backgrounds and structure
  • White

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 0 0 0
    On text
    7.46:1 AAA
    On white
    —

    Background, text, border · .sc_header .sc_rlinks_btm > ul > li .sc_actLinks .actLink_heading span, .btn_effect:after

  • Grey

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 0 0 54
    On text
    1.62:1 Fail
    On white
    4.61:1 AA

    Text, background · .sc_header .sc_search > span .seaches_sugge ul li.heading span, .tabbing .tabbing_products li a h4

  • Near Black

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 0 0 87
    On text
    2.16:1 Fail
    On white
    16.10:1 AAA

    Text, background · .b_section h4, footer .footer_nav .sc_callouts h4

  • Dark Grey

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 0 0 67
    On text
    —
    On white
    7.46:1 AAA

    Text, border · body, footer .sc_nl-signup h5

Colours

Brand colours and accents, most used first
  • Cadet Blue

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    80 10 0 29
    On text
    2.48:1 Fail
    On white
    3.01:1 AA large

    Text, background, border · .sc_header .sc_rlinks_btm > ul > li .sc_actLinks .actLink_heading, button.slick-arrow

  • Sandy Brown

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 42 71 0
    On text
    3.38:1 AA large
    On white
    2.20:1 Fail

    Background, text · .btn_gradient, .sc_header .sc_search > span .srch_action

  • Salmon

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 63 62 0
    On text
    2.50:1 Fail
    On white
    2.99:1 Fail

    Background · .btn_gradient, .sc_header .sc_search > span .srch_action

  • Dark Orange

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 53 96 2
    On text
    2.73:1 Fail
    On white
    2.73:1 Fail

    Text, border · .privilege_discount_sec_dsk ul .btn_orange a, span.ex_dis_ly

  • Medium Sea Green

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    100 0 40 26
    On text
    2.99:1 Fail
    On white
    2.49:1 Fail

    Text, background · .loading-bar:nth-child(1), .pincodeModel .pincode_section form input:disabled

  • Light Sky Blue

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    58 25 0 0
    On text
    3.74:1 AA large
    On white
    2.00:1 Fail

    Background · .tv_appliances .tabbing::after, .pincodeModel

  • Deep Orchid

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    11 78 0 31
    On text
    1.18:1 Fail
    On white
    6.30:1 AA

    Background, text · .electronics_devices .tabbing::after, .lifestyle .tabbing .tabbing_links li.active

  • Indian Red

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 82 66 0
    On text
    2.05:1 Fail
    On white
    3.64:1 AA large

    Background · .general_utilities .tabbing::after

  • Gold

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    0 20 100 0
    On text
    4.90:1 AA
    On white
    1.52:1 Fail

    Background · .general_utilities .tabbing::after

  • Light Orchid

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    21 70 0 18
    On text
    1.50:1 Fail
    On white
    4.96:1 AA

    Background · .tv_appliances .tabbing::after

  • Spring Green

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    84 0 48 9
    On text
    4.54:1 AA
    On white
    1.64:1 Fail

    Background · .home_kitchen .tabbing::after

  • Yellow

    HEX
    RGB
    HSL
    OKLCH
    CMYK
    6 0 100 13
    On text
    4.97:1 AA
    On white
    1.50:1 Fail

    Background · .home_kitchen .tabbing::after

Gradients

  • linear-gradient(0deg,#ff934b 0%,#ff5e62 100%)

  • linear-gradient(left,#ffcb00,#ff2d56)

  • linear-gradient(left,#6bbfff,#a63ed1)

Back to top ↑

Typography

Faces from Google Fonts are shown in the real thing. Others are licensed to the site, so they show in your device’s copy if you have one, or a stand-in if not.

Open Sans

Aa 700

Open Sans

System font, or not loaded on this page · weights 700 · headings · shown in a stand-in if you don’t have it

Aa 400

Arial

System font, or not loaded on this page · weights 400 · shown in a stand-in if you don’t have it

Aa 400 Aa 700

Roboto

Google Fonts · weights 400, 500, 700

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”

Type scale

From the site’s CSS
Heading 1 24px weight 500

shopclues.com

Heading 2 20px weight 500

Online Shopping Site India - Shop Online for me…

Heading 3 14px weight 400

Online Shopping Site India - Shop Online for me…

Heading 4 18px weight 400

Online Shopping Site India - Shop Online for me…

Heading 5 20px weight 500

Online Shopping Site India - Shop Online for me…

Body 14px

Online shopping site in India - Shop Online for men, women and kids fashion, home décor and furnishings, kitchen apppliances, health and sp…

Paragraph 24px / 24px weight 500

Online shopping site in India - Shop Online for men, women and kids fashion, home décor and furnishings, kitchen apppliances, health and sp…

Small 80%

Online shopping site in India - Shop Online for men, women and kids fashion, home décor and furnishings, kitchen apppliances, health and sp…

Link 10px / 1.2em weight 400 · uppercase

Read more about shopclues.com

Sizes in use

Most common across the site
  • 20pxline normal · 7 rules
  • 18pxline 57px · 5 rules
  • 16pxline 38px · 19 rules
  • 15px8 rules
  • 14pxline 21px · 33 rules
  • 13px11 rules
  • 12pxline 25px · 21 rules
  • 10pxline 1.2em · 4 rules

Back to top ↑

Elements

The main button and link as the site’s CSS draws them, and the corner radii and shadows it uses most.

Elements

Button

Get started

footer .sc_nl-signup input[type="submit"] · #B1B1B1 · radius 0 30px 30px 0

Link

Read our latest news today.

a · #24A3B5

Corner radius

  • 4px · 14×
  • 3px · 6×
  • 50px · 4×
  • 25px · 3×
  • 30px · 3×
  • 5px · 3×

Shadows

  • 0px 2px 8px 0px rgba(0,0,0,0.06)
  • 0px 1px 3px 0px rgba(0,0,0,0.12)
  • 0px 11px 13.35px 1.65px rgba(148,148,148,0.23)
  • 0px 3px 30px 0px rgba(0,0,0,0.24)

Back to top ↑

Layout

Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.

Grid

Breakpoints

1199

On a scale of 0 to 1440 px.

Content widths (max-width)

1680 px
980 px

Back to top ↑

Notes

Plain checks on what was found. Worth fixing if you look after this site.

Notes

  • ▲ CheckThe title is 134 characters. Google usually cuts titles near 60, so the end may not show in results.
  • ▲ CheckThe description is 217 characters. Search results usually show about 160.
  • ▲ CheckThere is no og:image, so links shared on social media show no picture.
  • ▲ CheckThe page doesn’t declare its language (the lang attribute on <html>).

Back to top ↑

Questions

Quick answers, from the same capture as the rest of this guide.

Questions

What font does shopclues.com use?
shopclues.com’s website uses two typefaces: Open Sans (headings and body text), a system font; Roboto, google Fonts.
What are shopclues.com’s brand colours?
The main colours on shopclues.com are Cadet Blue (#24A3B5), Sandy Brown (#FF934B), Salmon (#FF5E62), Dark Orange (#FB760B), Medium Sea Green (#00BC71) and Light Sky Blue (#6BBFFF).
What colour is shopclues.com’s text and background?
Body text is #555555 on a #EFF7FA background.
Is this shopclues.com’s official style guide?
No. SiteStyleGuide made it from shopclues.com’s public web pages on 29 October 2026, and isn’t affiliated with shopclues.com. Members can refresh a guide after 90 days to pick up changes.

Back to top ↑

Design tokens

Everything above as CSS variables, ready to paste into a project. Members can download the tokens as files for Figma (Tokens Studio), Style Dictionary and Tailwind.

Tokens

shopclues-com-tokens.css

Download

Free with an account: sign up or sign in, and you’ll come straight back here.

/* shopclues.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/shopclues.com) */
:root {
  /* Colours */
  --text: #555555;
  --background: #EFF7FA;
  --colour-white: #FFFFFF;
  --colour-grey: #757575;
  --colour-near-black: #212121;
  --colour-dark-grey: #555555;
  --colour-cadet-blue: #24A3B5;
  --colour-sandy-brown: #FF934B;
  --colour-salmon: #FF5E62;
  --colour-dark-orange: #FB760B;
  --colour-medium-sea-green: #00BC71;
  --colour-light-sky-blue: #6BBFFF;
  --colour-deep-orchid: #9C27B0;
  --colour-indian-red: #FF2D56;
  --colour-gold: #FFCB00;
  --colour-light-orchid: #A63ED1;
  --colour-spring-green: #25E778;
  --colour-yellow: #CFDD00;
  --gradient-1: linear-gradient(0deg,#ff934b 0%,#ff5e62 100%);
  --gradient-2: linear-gradient(left,#ffcb00,#ff2d56);
  --gradient-3: linear-gradient(left,#6bbfff,#a63ed1);

  /* Typefaces */
  --font-headings: 'Open Sans', sans-serif;
  --font-other: 'Arial';

  /* Type scale */
  --text-h1: 24px;
  --text-h2: 20px;
  --text-h3: 14px;
  --text-h4: 18px;
  --text-h5: 20px;
  --text-body: 14px;
  --text-p: 24px;
  --leading-p: 24px;
  --text-small: 80%;
  --text-a: 10px;
  --leading-a: 1.2em;

  /* Shape */
  --radius-1: 4px;
  --radius-2: 3px;
  --radius-3: 50px;
  --radius-4: 25px;
  --radius-5: 30px;
  --radius-6: 5px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 1199px;
  --max-width-1: 1680px;
  --max-width-2: 980px;
}

Back to top ↑

Share

Links open each service’s own share page. Nothing from them loads here.

Share

Run shopclues.com?

Add the badge to your site

Link to this guide from your own site, so your team, designers and agencies can find your colours and fonts in one place.

View our style guide on SiteStyleGuide
<a href="https://sitestyleguide.com/shopclues.com" title="shopclues.com style guide on SiteStyleGuide"><img src="https://sitestyleguide.com/public/badge.svg" alt="View our style guide on SiteStyleGuide" width="200" height="44"></a>

Back to top ↑

Other websites using Open Sans as their main typeface
Websites whose lead colour is closest to shopclues.com’s

Captured from shopclues.com on 29 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by shopclues.com; this guide describes the public website for reference.