Hi5 Friend Layouts

Quick Links

Layouts / Themes

This sections provides you free pre-made layouts/themes for your hi5 profile page. Choose a theme then Go here and copy&paste the following codes. Read How to Install Layouts or see Hex color charts for html color codes.

General

THEME: Pink

PERSONAL INFO SECTION :
text color: #987684
link color: #BC688A

HEADER SECTIONS :
background color:: #FF9ACC
text color: #FCE5F7
text font: Impact

table.box_profile_picture_links

{background-color:#FFF2F8;}

a.link_profile_left:link {text-decoration:none; cursor: crosshair; color:#BF608A;}

a.link_profile_left:hover {text-decoration:none; cursor: crosshair; color:#BF608A; background-color:#FFF2F8;}

a.link_profile_left:visited {text-decoration:none; cursor: crosshair; color:#BF608A;}

a.link_profile_left:active {text-decoration:none; cursor: crosshair; color:#BF608A;}

a.link_black:link {text-decoration:none; cursor: crosshair; color:#BF608A;}

a.link_black:hover {text-decoration:none; cursor: crosshair; color:#BF608A; background-color:#FFF2F8;}

a.link_black:visited {text-decoration:none; cursor: crosshair; color:#BF608A;}

a.link_black:active {text-decoration:none; cursor: crosshair; color:#BF608A;}

a:hover img{filter:none;  }

img {filter:gray}

.text_header {

font-size: 20px;

font-family: impact;

}

.box_profile_info_small_heading{

background-color:#FFF2F8 ;

border:1px solid white;

color: #BF608A;

}

a.username_dark:hover {text-decoration:none; cursor: crosshair; color:#BF608A; background-color:#FFF2F8;}

.text_header_ltblue {color: #BF608A;}

.link_blue {text-decoration:none; cursor: crosshair; color:#FFE6F1;}

a.link_blue:link {text-decoration:none; cursor: crosshair;}

a.link_blue:hover {text-decoration:none; cursor: crosshair; color:#BF608A; background-color:#FFF2F8;}

a.link_blue:visited {text-decoration:none; cursor: crosshair;}

a.link_blue:active {text-decoration:none; cursor: crosshair;}

.box_profile_picture_links

{margin: 10px 10px 10px 10px;   }

.box_profile_info_large_heading

{background-color:#FFBFDC ; color: white;

padding: 10px;

border:1px solid white;

margin: 20px;

}

.box_profile_info_large_content

{ background-color: #FFF2F8; padding: 10px;

border:1px solid white;

}

</style>

<div class="box_profile_info_small_content" style="position:relative; top:300px; left:200px;">layout by: <a class="link_blue" href="http://hi5-friend.com">hi5-friend.com</a></div>

THEME: Blue

PERSONAL INFO SECTION :
text color: #4D8BCB
link color: #094787

HEADER SECTIONS :
background color:: #94C8FF
text color: #E3F0FF
text font: Impact

table.box_profile_picture_links

{background-color:#F2F8FF;}

a.link_profile_left:link {text-decoration:none; cursor: crosshair; color:#114F8F;}

a.link_profile_left:hover {text-decoration:none; cursor: crosshair; color:#114F8F; background-color:#F2F8FF;}

a.link_profile_left:visited {text-decoration:none; cursor: crosshair; color:#114F8F;}

a.link_profile_left:active {text-decoration:none; cursor: crosshair; color:#114F8F;}

a.link_black:link {text-decoration:none; cursor: crosshair; color:#114F8F;}

a.link_black:hover {text-decoration:none; cursor: crosshair; color:#114F8F; background-color:#F2F8FF;}

a.link_black:visited {text-decoration:none; cursor: crosshair; color:#114F8F;}

a.link_black:active {text-decoration:none; cursor: crosshair; color:#114F8F;}

a:hover img{filter:none;  }

img {filter:gray}

.text_header {

font-size: 20px;

font-family: impact;

}

.box_profile_info_small_heading{

background-color:#F2F8FF ;

border:1px solid white;

color: #114F8F;

}

a.username_dark:hover {text-decoration:none; cursor: crosshair; color:#114F8F; background-color:#F2F8FF;}

.text_header_ltblue {color: #114F8F;}

.link_blue {text-decoration:none; cursor: crosshair; color:#5C9ADA;}

a.link_blue:link {text-decoration:none; cursor: crosshair;}

a.link_blue:hover {text-decoration:none; cursor: crosshair; color:#114F8F; background-color:#F2F8FF;}

a.link_blue:visited {text-decoration:none; cursor: crosshair;}

a.link_blue:active {text-decoration:none; cursor: crosshair;}

.box_profile_picture_links

{margin: 10px 10px 10px 10px;   }

.box_profile_info_large_heading

{background-color:#94C8FF ; color: white;

padding: 10px;

border:1px solid white;

margin: 20px;

}

.box_profile_info_large_content

{ background-color: #F2F8FF; padding: 10px;

border:1px solid white;

}

</style>

<div class="box_profile_info_small_content" style="position:relative; top:300px; left:200px;">layout by: <a class="link_blue" href="http://hi5-friend.com">hi5-friend.com</a></div>

THEME: Orange

PERSONAL INFO SECTION :
text color: #9D7545
link color: #A27A4A

HEADER SECTIONS :
background color:: #DFB787
text color: #FFEBD2
text font: Impact

table.box_profile_picture_links

{background-color:#FFF6EA;}

a.link_profile_left:link {text-decoration:none; cursor: crosshair; color:#A98151;}

a.link_profile_left:hover {text-decoration:none; cursor: crosshair; color:#A98151; background-color:#FFF6EA;}

a.link_profile_left:visited {text-decoration:none; cursor: crosshair; color:#A98151;}

a.link_profile_left:active {text-decoration:none; cursor: crosshair; color:#A98151;}

a.link_black:link {text-decoration:none; cursor: crosshair; color:#A98151;}

a.link_black:hover {text-decoration:none; cursor: crosshair; color:#A98151; background-color:#FFF6EA;}

a.link_black:visited {text-decoration:none; cursor: crosshair; color:#A98151;}

a.link_black:active {text-decoration:none; cursor: crosshair; color:#A98151;}

a:hover img{filter:none;  }

img {filter:gray}

.text_header {

font-size: 20px;

font-family: impact;

}

.box_profile_info_small_heading{

background-color:#FFF6EA ;

border:1px solid white;

color: #A98151;

}

a.username_dark:hover {text-decoration:none; cursor: crosshair; color:#A98151; background-color:#FFF6EA;}

.text_header_ltblue {color: #A98151;}

.link_blue {text-decoration:none; cursor: crosshair; color:#414200;}

a.link_blue:link {text-decoration:none; cursor: crosshair;}

a.link_blue:hover {text-decoration:none; cursor: crosshair; color:#A98151; background-color:#FFF6EA;}

a.link_blue:visited {text-decoration:none; cursor: crosshair;}

a.link_blue:active {text-decoration:none; cursor: crosshair;}

.box_profile_picture_links

{margin: 10px 10px 10px 10px;   }

.box_profile_info_large_heading

{background-color:#F6CE9E; color: white;

padding: 10px;

border:1px solid white;

margin: 20px;

}

.box_profile_info_large_content

{ background-color: #FFF6EA; padding: 10px;

border:1px solid white;

}

</style>

<div class="box_profile_info_small_content" style="position:relative; top:300px; left:200px;">layout by: <a class="link_blue" href="http://hi5-friend.com">hi5-friend.com</a></div>

THEME: Green

PERSONAL INFO SECTION :
text color: #539657
link color: #579A5B

HEADER SECTIONS :
background color:: #96D99A
text color: #D5FFD8
text font: Impact

table.box_profile_picture_links

{background-color:#ECFFED;}

a.link_profile_left:link {text-decoration:none; cursor: crosshair; color:#125516;}

a.link_profile_left:hover {text-decoration:none; cursor: crosshair; color:#125516; background-color:#ECFFED;}

a.link_profile_left:visited {text-decoration:none; cursor: crosshair; color:#125516;}

a.link_profile_left:active {text-decoration:none; cursor: crosshair; color:#125516;}

a.link_black:link {text-decoration:none; cursor: crosshair; color:#125516;}

a.link_black:hover {text-decoration:none; cursor: crosshair; color:#125516; background-color:#ECFFED;}

a.link_black:visited {text-decoration:none; cursor: crosshair; color:#125516;}

a.link_black:active {text-decoration:none; cursor: crosshair; color:#125516;}

a:hover img{filter:none;  }

img {filter:gray}

.text_header {

font-size: 20px;

font-family: impact;

}

.box_profile_info_small_heading{

background-color:#ECFFED ;

border:1px solid white;

color: #125516;

}

a.username_dark:hover {text-decoration:none; cursor: crosshair; color:#125516; background-color:#ECFFED;}

.text_header_ltblue {color: #125516;}

.link_blue {text-decoration:none; cursor: crosshair; color:#414200;}

a.link_blue:link {text-decoration:none; cursor: crosshair;}

a.link_blue:hover {text-decoration:none; cursor: crosshair; color:#125516; background-color:#ECFFED;}

a.link_blue:visited {text-decoration:none; cursor: crosshair;}

a.link_blue:active {text-decoration:none; cursor: crosshair;}

.box_profile_picture_links

{margin: 10px 10px 10px 10px;   }

.box_profile_info_large_heading

{background-color:#92D596; color: white;

padding: 10px;

border:1px solid white;

margin: 20px;

}

.box_profile_info_large_content

{ background-color: #ECFFED; padding: 10px;

border:1px solid white;

}

</style>

<div class="box_profile_info_small_content" style="position:relative; top:300px; left:200px;">layout by: <a class="link_blue" href="http://hi5-friend.com">hi5-friend.com</a></div></style>

THEME: Gray

PERSONAL INFO SECTION :
text color: #7C7C7C
link color: #888888

HEADER SECTIONS :
background color:: #BEBEBE
text color: #EEEEEE
text font: Impact Bold

table.box_profile_picture_links

{background-color:#F7F7F7;}

a.link_profile_left:link {text-decoration:none; cursor: crosshair; color:#878787;}

a.link_profile_left:hover {text-decoration:none; cursor: crosshair; color:#878787; background-color:#F7F7F7;}

a.link_profile_left:visited {text-decoration:none; cursor: crosshair; color:#878787;}

a.link_profile_left:active {text-decoration:none; cursor: crosshair; color:#878787;}

a.link_black:link {text-decoration:none; cursor: crosshair; color:#878787;}

a.link_black:hover {text-decoration:none; cursor: crosshair; color:#878787; background-color:#EDEDED;}

a.link_black:visited {text-decoration:none; cursor: crosshair; color:#878787;}

a.link_black:active {text-decoration:none; cursor: crosshair; color:#878787;}

a:hover img{filter:none;  }

img {filter:gray}

.text_header {

font-size: 20px;

font-family: impact;

}

.box_profile_info_small_heading{

background-color:#F7F7F7 ;

border:1px solid white;

color: #878787;

}

a.username_dark:hover {text-decoration:none; cursor: crosshair; color:#878787; background-color:#EDEDED;}

.text_header_ltblue {color: #878787;}

.link_blue {text-decoration:none; cursor: crosshair; color:#414200;}

a.link_blue:link {text-decoration:none; cursor: crosshair;}

a.link_blue:hover {text-decoration:none; cursor: crosshair; color:#878787; background-color:#EDEDED;}

a.link_blue:visited {text-decoration:none; cursor: crosshair;}

a.link_blue:active {text-decoration:none; cursor: crosshair;}

.box_profile_picture_links

{margin: 10px 10px 10px 10px;   }

.box_profile_info_large_heading

{background-color:#858585; color: white;

padding: 10px;

border:1px solid white;

margin: 20px;

}

.box_profile_info_large_content

{ background-color: #F7F7F7; padding: 10px;

border:1px solid white;

}

</style>

<div class="box_profile_info_small_content" style="position:relative; top:300px; left:200px;">layout by: <a class="link_blue" href="http://hi5-friend.com">hi5-friend.com</a></div></style>

Shout Box

Stat

Hi-Friend! � 2012.
Disclaimer & Private Policy. Terms of Use.