DIXONS.CO.UK uses 13 Font Awesome icons and they appear 51 times.

Font Awesome icon usage statistics

Font Awesome information of DIXONS.CO.UK in detail

  • 13 types of Font Awesome iconic font are used and found 51 times in total.
  • DIXONS.CO.UK used 3.9 Font Awesome classes per each class in average.
38 icon-chevron-right
2 icon-map-marker
1 icon-pinterest
1 icon-shopping-cart
1 icon-facebook-sign
1 icon-youtube-play
1 icon-quote-left
1 icon-home
1 icon-google-plus-sign
1 icon-twitter
1 icon-search
1 icon-user
1 icon-reorder
  • Font Awesome usage statistics of DIXONS.CO.UK are based on first landing page and within top 1M websites only. Click the font icon to see all websites using it.
  • DIXONS.CO.UK includes "http://currys.cdn.dixons.com/css/style.css" to use Font Awesome and information from CSS is like below.
    • @font-face{font-weight:400;font-style:normal;font-family:Knowhow;src:url(fonts/knowhow.eot) format('embedded-opentype'),url(fonts/knowhow.ttf) format('truetype'),url(fonts/knowhow.svg) format('svg')}body{font-size:13px;font-family:Helvetica,Arial,Sans-serif}.nosp{margin:0}.nowrap{overflow:hidden;width:80%;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}.brandLight{color:#1e249e}.brandDark{color:#011e62}.txtOverflow{white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden}.center{text-align:center}.right{text-align:right}.left{text-align:left}.error{color:#a52321}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5em}h1 *,h2 *,h3 *,h4 *,h5 *,h6 *{font-style:normal!important}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{display:inline-block;font-size:.7em;color:#161b7a!important;font-weight:400}h1 .buyersGuide,h2 .buyersGuide,h3 .buyersGuide,h4 .buyersGuide,h5 .buyersGuide,h6 .buyersGuide{color:#06e!important;margin-top:.7em;font-size:.62em;font-weight:400}h1{font-size:2.2em;color:#333}h2{font-size:1.8em}h3{font-size:1.6em}h4{font-size:1.4em}h5{font-size:1em}h6{font-size:.88em;text-transform:uppercase;color:#888}h4 .right{float:right}.pageTitle{font-size:1.6em;color:#161b7a}p{margin-top:0;line-height:1.4em}ol,ul{margin-top:0;padding-left:1.2em}ol li,ul li{margin-bottom:.25em}ul{list-style-type:disc}ul ul{margin:.2em 0}ol{padding-left:1.8em}ol.simple,ul.simple{padding:0;list-style:none}ol.simple .simple,ul.simple .simple{padding-left:1em}a{color:#06e}a i{text-decoration:none!important}em{color:#444}abbr[title]{cursor:help;text-transform:uppercase;border-color:#999;color:#444;font-size:.92em;letter-spacing:.02em}#wrapper{margin:0 auto;zoom:1}.row{clear:both;position:relative;height:1%;padding:0 0 10px}.row:after,.row:before{content:'';display:table}.row:after{clear:both}.nosp{width:100%!important}[class*=col],[class^=col]{display:inline;float:left}.row .row{width:102%;margin:0;left:-2%}.row .row [class*=col],.row .row [class^=col]{margin-left:2%;-webkit-box-sizing:padding-box;-moz-box-sizing:padding-box;box-sizing:padding-box}.row .row .col1{width:6.3333333333%}.row .row .col2{width:14.666666667%}.row .row .col3{width:22.979%;width:23%}.row .row .col4{width:31.333333333%}.row .row .col5{width:39.666666667%}.row .row .col6{width:48%}.row .row .col7{width:56.333333333%}.row .row .col8{width:64.666666667%}.row .row .col9{width:73%}.row .row .col10{width:81.333333333%}.row .row .col11{width:89.666666667%}.row .row .col12{width:98%}.row .nosp{left:0;width:100%}.row .nosp [class*=col],.row .nosp [class^=col]{margin-left:0}.row .nosp .col1{width:6.3333333333%}.row .nosp .col2{width:16.666666667%}.row .nosp .col3{width:22.979%;width:25%}.row .nosp .col4{width:33.333333333%}.row .nosp .col5{width:41.666666667%}.row .nosp .col6{width:50%}.row .nosp .col7{width:58.333333333%}.row .nosp .col8{width:66.666666667%}.row .nosp .col9{width:75%}.row .nosp .col10{width:83.333333333%}.row .nosp .col11{width:91.666666667%}.row .nosp .col12{width:100%}.plug{-webkit-box-sizing:padding-box;-moz-box-sizing:padding-box;box-sizing:padding-box;padding:1em!important}.tsp{clear:both;margin-top:10px!important}.bsp{clear:both;margin-bottom:1em}#wrapper{width:1240px}.row{left:-20px;width:1260px}[class*=col],[class^=col]{margin-left:20px}.col1{width:85px}.col2{width:190px}.col3{width:295px}.col4{width:400px}.col5{width:505px}.col6{width:610px}.col7{width:715px}.col8{width:820px}.col9{width:925px}.col10{width:1030px}.col11{width:1135px}.col12{width:1240px}.nosp{left:0;padding-bottom:0}.nosp .col1{width:103.33px;margin-left:0}.nosp .col2{width:206.67px;margin-left:0}.nosp .col3{width:310px;margin-left:0}.nosp .col4{width:413.33px;margin-left:0}.nosp .col5{width:516.67px;margin-left:0}.nosp .col6{width:620px;margin-left:0}.nosp .col7{width:723.33px;margin-left:0}.nosp .col8{width:826.67px;margin-left:0}.nosp .col9{width:930px;margin-left:0}.nosp .col10{width:1033.33px;margin-left:0}.nosp .col11{width:1136.67px;margin-left:0}.nosp .col12{width:1240px;margin-left:0}aside .row{width:100%!important;left:0!important;margin:0!important}aside .row [class*=col],aside .row [class^=col]{width:100%!important;margin-left:0!important;padding-bottom:10px}#fixed+.col9{float:right}@media only screen and (min-width:1024px) and (max-width:1239px){#wrapper{width:978px}.row{left:-30px;width:1008px}[class*=col],[class^=col]{margin-left:30px}.col1{width:54px}.col2{width:138px}.col3{width:222px}.col4{width:306px}.col5{width:390px}.col6{width:474px}.col7{width:558px}.col8{width:642px}.col9{width:726px}.col10{width:810px}.col11{width:894px}.col12{width:978px}.nosp{left:0;padding-bottom:0}.nosp .col1{width:81.5px;margin-left:0}.nosp .col2{width:163px;margin-left:0}.nosp .col3{width:244.5px;margin-left:0}.nosp .col4{width:326px;margin-left:0}.nosp .col5{width:407.5px;margin-left:0}.nosp .col6{width:489px;margin-left:0}.nosp .col7{width:570.5px;margin-left:0}.nosp .col8{width:652px;margin-left:0}.nosp .col9{width:733.5px;margin-left:0}.nosp .col10{width:815px;margin-left:0}.nosp .col11{width:896.5px;margin-left:0}.nosp .col12{width:978px;margin-left:0}}@media only screen and (min-width:600px) and (max-width:1024px){#wrapper{overflow:hidden}.row{width:100%;left:0}[class*=col],[class^=col]{width:100%;margin-left:0;margin-bottom:1em}.row .row{width:100%;left:0}.row .row [class*=col],.row .row [class^=col]{float:none;padding:0;margin-left:0;width:100%}.nosp [class*=col],.nosp [class^=col]{width:100%;margin-left:0}}@media only screen and (max-width:599px){#wrapper{overflow:hidden;padding:0;width:100%;min-width:300px;font-size:14px}.row{float:none;width:100%;left:0;padding-bottom:0}.row [class*=col],.row [class^=col]{display:block;float:none;width:100%;margin-left:0;margin-bottom:1em}.row .row{width:100%;left:0}.row .row [class*=col],.row .row [class^=col]{display:block;width:100%;padding:0;margin-left:0}.nosp [class*=col],.nosp [class^=col]{width:100%;margin-left:0}}[data-component=multiple-range].initialized{margin:40px 20px 0;padding-bottom:10px;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[data-component=multiple-range].initialized .inputs{display:none}[data-component=multiple-range].initialized .range-slider{position:relative;height:12px;background:#ddd}[data-component=multiple-range].initialized .range-slider+.price,[data-component=multiple-range].initialized .range-slider+.price+.price{float:left;padding-top:15px;margin-top:-55px;margin-left:-18px}[data-component=multiple-range].initialized .range-slider+.price+.price{float:right;margin-right:-18px}[data-component=multiple-range].initialized .range-slider:after,[data-component=multiple-range].initialized .range-slider:before{content:'';position:absolute;width:18px;left:-18px;height:100%;background:#ddd}[data-component=multiple-range].initialized .range-slider:after{left:auto;right:-18px}[data-component=multiple-range].initialized .range-handle{position:absolute;z-index:2;top:-8px!important;width:0;height:24px;text-indent:-9999px;cursor:pointer;-webkit-user-select:none;-webkit-touch-callout:none}[data-component=multiple-range].initialized .range-handle span{position:absolute;top:0;right:0;width:18px;height:100%;background:#555;background:-webkit-linear-gradient(top,#fcfcfc,#e5e5e5);background:-moz-linear-gradient(top,#fcfcfc,#e5e5e5);background:-o-linear-gradient(top,#fcfcfc,#e5e5e5);background:-ms-linear-gradient(top,#fcfcfc,#e5e5e5);background:linear-gradient(to bottom,#fcfcfc,#e5e5e5);border:1px solid #d7d7d7;-webkit-border-radius:2px;border-radius:2px}[data-component=multiple-range].initialized .range-handle+.range-handle span{right:auto;left:0}[data-component=multiple-range].initialized .selected-range{position:absolute;z-index:1;top:0;bottom:0;left:0;right:0;background:#63aa31}.alert{padding:10px 1em;border:1px solid #ccc;border:1px solid rgba(0,0,0,.1);background:#fcf8e3;color:#444!important;-webkit-box-shadow:0 0 3px rgba(0,0,0,.1);box-shadow:0 0 3px rgba(0,0,0,.1)}.alert i{font-style:normal!important}.alert p:last-child{margin-bottom:0}.alertBold{background:#1e249e;color:#eee!important}.alertRequired{background:#f2dede;color:#a52321!important}.alertSuccess{background:#dff0d8;color:#1a6d1a!important}@font-face{font-family:FontAwesome;src:url(fonts//fontawesome-webfont.eot?v=3.2.0);src:url(fonts//fontawesome-webfont.eot?#iefix&v=3.2.0) format('embedded-opentype'),url(fonts//fontawesome-webfont.woff?v=3.2.0) format('woff'),url(fonts//fontawesome-webfont.ttf?v=3.2.0) format('truetype'),url(fonts//fontawesome-webfont.svg#fontawesomeregular?v=3.2.0) format('svg');font-weight:400;font-style:normal}

Examples and source code

Various Font Awesome icon examples and source code using icon-chevron-right which has been used mostly(38 times) by DIXONS.CO.UK

Inline Icons

icon-chevron-right

Place Font Awesome icons just about anywhere with the <i> tag.

<i class=" icon-chevron-right"></i> icon-chevron-right
Icon classes are echoed via CSS :before.

Larger Icons

icon-chevron-right

icon-chevron-right

icon-chevron-right

icon-chevron-right

To increase icon sizes relative to their container, use the icon-large (33% increase), icon-2x, icon-3x, icon-4x, or icon-5x classes. 

<p><i class=" icon-chevron-right icon-large"></i> icon-chevron-right</p>
<p><i class=" icon-chevron-right icon-2x"></i> icon-chevron-right</p>
<p><i class=" icon-chevron-right icon-3x"></i> icon-chevron-right</p>
<p><i class=" icon-chevron-right icon-4x"></i> icon-chevron-right</p>
If your icons are getting chopped off on top and bottom, make sure you have sufficient line-height.

List Icons

  • Font Awesome icon can be used
  • to easily replace lists

Use icon-ul and icon-li to easily replace default bullets in unordered lists.

<ul class="icon-ul">
  <li><i class="icon-li  icon-chevron-right"></i>Font Awesome icon can be used</li>
  <li><i class="icon-li  icon-chevron-right icon-spin"></i>to easily replace lists</li>
</ul>

Bordered & Pulled Icons

Use a few styles together and you'll have easy pull quotes or a great introductory article icon.

Use icon-border and pull-right or pull-left for easy pull quotes or article graphics. 

<i class=" icon-chevron-right icon-2x pull-left icon-border"></i>
Use a few styles together and you'll have easy pull quotes or a great introductory article icon.

Rotated & Flipped

  normal
  icon-rotate-90
  icon-rotate-180
  icon-rotate-270
  icon-flip-horizontal
  icon-flip-vertical

To arbitrarily rotate and flip icons, use the icon-rotate-* and icon-flip-* classes. 

<i class=" icon-chevron-right"></i>  normal<br>
<i class=" icon-chevron-right icon-rotate-90"></i>  icon-rotate-90<br>
<i class=" icon-chevron-right icon-rotate-180"></i>  icon-rotate-180<br>
<i class=" icon-chevron-right icon-rotate-270"></i>  icon-rotate-270<br>
<i class=" icon-chevron-right icon-flip-horizontal"></i>  icon-flip-horizontal<br>
<i class=" icon-chevron-right icon-flip-vertical"></i>  icon-flip-vertical

Spinning Icons

Use the icon-spin class to get any icon to rotate. 

<i class=" icon-chevron-right icon-2x icon-spin"></i>
<i class=" icon-chevron-right icon-3x icon-spin"></i>
<i class=" icon-chevron-right icon-4x icon-spin"></i>

CSS3 animations aren't supported in IE8 - IE9.

Stacked Icons

icon-chevron-right on icon-check-empty
icon-chevron-right on icon-circle
icon-chevron-rightl on icon-sign-blank
icon-ban-circle on icon-chevron-right

To stack multiple icons, use the icon-stack class on the parent, the icon-light for the regularly sized icon, and icon-stack-base for the larger icon. icon-light can be used as an alternative icon color. You can even throw larger icon classes on the parent to get further control of sizing. 

<span class="icon-stack">
  <i class=" icon-check-empty icon-stack-base"></i>
  <i class=" icon-chevron-right "></i>
</span>
icon-chevron-right on icon-check-empty<br>
<span class="icon-stack">
  <i class=" icon-circle icon-stack-base"></i>
  <i class=" icon-chevron-right icon-light"></i>
</span>
icon-chevron-right on icon-circle<br>
<span class="icon-stack">
  <i class=" icon-sign-blank icon-stack-base"></i>
  <i class=" icon-chevron-right icon-light "></i>
</span>
icon-chevron-right on icon-sign-blank<br>
<span class="icon-stack">
  <i class=" icon-chevron-right icon-light"></i>
  <i class=" icon-ban-circle icon-stack-base text-error"></i>
</span>
icon-ban-circle on icon-chevron-right