Rating Icons

Select logo

Rating
Icons

By Jacob Palme

First version 1999

Last revision
28 October 2000

Partially superseded by
shaded rating icons set

 

Note 1: These icons have intentionally been designed to be rather small and unobtrusive. Rating information should not dominate the web page, it should be available when you look for it. Making the rating icons too obtrusive will cause people to not accept using them at all.

Note 2: There is usually a problem with distinguishing items at the top end of the rating scale. A common solution to this is to introduce half stars. I have tried below, to introduce a four-and-a-half star icon. This will not work with the dice-formatted icons. A better solution might be to slant the rating scale, so that it has more resolution in the upper end, as I have proposed to the project.

Note 3: Icons which below are shown in table cells with a background colour, are anti-aliased in order to look right with this particular background colour. They may work also with other similar background colors. For example, my experience is that the icons for white background will work OK, also with a light yellow background.


 
No of stars/dots
Legend
Height
(pixels)
Width
(pixels)
No
Blank
One
Two
Three
Four
Four-
and-
a-half
Five
Six
Stars in a row on white.
6
34
   
 
The icons above are all of equal size, filled out with white to the width of the five-star ribbon like this:
Stars in a row on khaki-green (#CECE9C)
6
7-34
   
 
 
Stars in a row on yellow (#FFFFCE)
6
7-34
   
 
 
Dice with black dots on white
15
15
 
Inverted dice for highlighting
15
15
   
 
Dice with black dots on khaki-green (#CECE9C)
15
15
 
Dice with black dots on grey background (#DDDDDD)
15
15
 
Dice with red stars on white (can also be used on light yellow background)
15
15
 
Dice with black dot on yellow
 The dice with black dots on white background can be used here 

Numeric rating buttons

               
Other useful icons

                   

                    

          
 
   
          
    More about SELECT. This web page made by Jacob Palme.