#!/usr/bin/perl
use strict;
use warnings;
use CGI qw/:standard/;

my %colorchart;
while( my ($color_code, $element_id) = split(/\s+/, <DATA>)) {
    $colorchart{$element_id} = $color_code;
}

my $style;
foreach my $key (sort keys %colorchart) {
    $style .= "#b$key {background-color: $colorchart{$key}}\n";
}

print header, start_html(-title=>'Colors', -style => {-code => $style});

foreach my $key (sort keys %colorchart) {
    print qq^<div id="b$key" class="btn px"><a href="#"></a>$key - $colorchart{$key}</div>\n^;
}

print end_html;

__DATA__
#0000FF  1 Blue  
#8A2BE2  2 BlueViolet  
#A52A2A  3 Brown  
#DEB887  4 BurlyWood  
#5F9EA0  5 CadetBlue  
#7FFF00  6 Chartreuse  

##</code><code>##

#!/usr/bin/perl
use strict;
use warnings;
use CGI qw/:standard/;

my %seen;
my $style;
my $grid;
while( my ($color_code, $element_id) = split(/\s+/, <DATA>)) {
    unless($seen{$color_code}) {
        $style .= ".c$color_code { background-color: #$color_code; }\n";
        $seen{$color_code} = $color_code;
    }
    $grid .= qq^<div id="$element_id" class="btn px c$color_code"><a href="#"></a>$element_id - $color_code</div>\n^;
}

print header, start_html(-title=>'Colors', -style => {-code => $style}), $grid, end_html;


__DATA__
0000FF  1 Blue  
8A2BE2  2 BlueViolet  
A52A2A  3 Brown  
DEB887  4 BurlyWood  
5F9EA0  5 CadetBlue  
7FFF00  6 Chartreuse  
0000FF  7 Blue  
8A2BE2  8 BlueViolet