blogfreakz.com » design

Create a Heart Shape With Pure CSS3

Marvin@Blogfreakz — Fri, 10 Feb 2012 05:40:03 +0000

For celebrating Valentine’s Day, this is a great tutorial from Web Froze where you get to use pure CSS3 to create a nice heart shape for your web design graphics. Below are the following codes to achieve this.

CSS

.heart-shape {

position: relative;

width: 100px;

height: 90px;

margin:10px 0px;

.heart-shape:before,

.heart-shape:after {

position: absolute;

content: "";

left: 50px;

top: 0;

width: 50px;

height: 80px;

background: #fd2d8a;

-moz-border-radius: 50px 50px 0 0;

border-radius: 50px 50px 0 0;

-webkit-transform: rotate(-45deg);

-moz-transform: rotate(-45deg);

-ms-transform: rotate(-45deg);

-o-transform: rotate(-45deg);

transform: rotate(-45deg);

-webkit-transform-origin: 0 100%;

-moz-transform-origin: 0 100%;

-ms-transform-origin: 0 100%;

-o-transform-origin: 0 100%;

transform-origin: 0 100%;

.heart-shape:after {

left: 0;

-webkit-transform: rotate(45deg);

-moz-transform: rotate(45deg);

-ms-transform: rotate(45deg);

-o-transform: rotate(45deg);

transform: rotate(45deg);

-webkit-transform-origin: 100% 100%;

-moz-transform-origin: 100% 100%;

-ms-transform-origin: 100% 100%;

-o-transform-origin: 100% 100%;

transform-origin :100% 100%;

HTML

30+ Creative Heart Logos

Keith@Blogfreakz — Fri, 10 Feb 2012 05:28:43 +0000

Valentine’s Day is slowly creeping closer and for graphic designers, visual artists and the like, this is the time to incorporate the season’s theme into their designs.

Just as pumpkins are to Halloween and a gifts are to Christmas, a heart is to Valentine’s Day. And on that note, here are 36 cleverly designed heart logos to inspire all artists and designers! Hope these samples will help you come up with more ideas this Happy Hearts’ day.

Beat Love

Beloved

Cloud of Love

Heart Break

Heart Beats

Love Clicks

Love Biites

Love Heart

Love heart is a brand symbol wherein the letters LOVE form a heart and is ideal for any company wishing to have a heart in its logo. Available in 3 color schemes.

Love Idea

Love Licks

NaturaLove

Think Love

What Is Love?

Datetender

Match

Love Hook

Love Link

Pen Pals

LoveGeek

Available in 3 color schemes.

Heart Bomb

Bee Heart

Beeheart is ideal for a blog site or any other business site. Available in 3 design schemes.

Bird Lover

Bugluv

Butterfly Hearts

Pig Love

Cloved

Love Clip

Love Clip comes from the concept of bending two clips to form a heart.

Love Clip (2)

Cardiologic

Love Systems

Write Lover

ILove2write

Love Sushi

Game Lover

Sex Lovers

Bitter Love

A brand symbol ideal for a food and beverages industry, games and retail. Available in 3 color schemes.

Incoming search terms for the article:

Create a Glassy Text Effect with Photoshop

Marvin@Blogfreakz — Thu, 09 Feb 2012 09:41:55 +0000

There are numerous online Photoshop tutorials about text effects but if you want that sleek and glassy effect, chances are you’ll find only a few of them. So I’m going to share with you a very cool glass text effect tutorial by the guys at 2ExpertDesign that would only take around 30 minutes to make.

Click on the above image to see the tutorial.

This is fast, easy, and well worth the effort. Get ready to be creative with your text — grab the PSD file now!

Incoming search terms for the article:

How to Improve as a Graphic Designer

Marvin@Blogfreakz — Tue, 07 Feb 2012 10:33:59 +0000

Stagnation is one thing that stifles most artists and designers when they’ve reached their plateau. It happens when they rely too much on their comfort zone that it simply stops them from improving, learning, and exploring new techniques and styles. Obviously this causes them to lag behind current changes especially in the fast-paced world of graphic and web design.

This can threaten one’s career. Why? Because the field changes so rapidly that today’s design can be obsolete tomorrow, literally. So if you’re a graphic designer, you always have to be open to changes and embrace the latest trends. Don’t limit yourself with what you already know, and if you’ve found your comfort zone, then strive to learn new designs and techniques, improve your style continuously and push yourself out of that zone.

This is what web designer Tom Ross argues against popular belief, that designers should never find their style. It could backfire later on in their careers. So to prevent it, here are useful tips on how to improve and become a better designer and could save them for a major professional and creative setback.

20+ Free Valentine Photoshop Brush Sets

Marvin@Blogfreakz — Tue, 07 Feb 2012 04:52:00 +0000

It’s the love month once again, so I’ve picked up free lovely brush sets that would help you create a festive Valentine design.

Click on the image to grab the brushes and spread some love!

Valentine Floral Brushes

Valentine Floral Heart Brushes

Vector Style Hearts Brushes

Valentine PSD

Valentine Day Heart Brushes

My Heart Brushes

Heart Fractal Brushes

Valentine Brush Set for Photoshop

Photoshop Brushes Hearts

Valentine Glow Hearts

Hearts Fractal Brush

Candy Hearts Brushes

Heart Brushes

Heart Stamps

Damned Hearts

True Love Heart Brush Set

Love Brushes

Hearts Photoshop Brushes

Hearts in Motion

Brush-Pack Hearts

Valentine Mega Art Brush Set

Valentine Scraps 2

Valentine Corners

Photoshop Brushes- Hearts

Incoming search terms for the article:

10 Creative And Uniquely Designed Navigation Menus

Keith@Blogfreakz — Mon, 30 Jan 2012 14:47:48 +0000

A well-designed navigation bar leaves a good impression on first-time visitors. Here’s a list of navigation menu designs that would make you go “why didn’t I think of that?”

Small Stone Recordings – Here’s a perfect example of incorporating your site’s theme with the design. This immediately gives your site’s visitors an idea of what your site and business is all about.

Loodo – Now here’s a design that would appeal to anyone who enjoys playing traditional board games.

Fantasy Cartography – Talk about creating a site map! Here’s a very original approach in navigation menu design by Robin C. Kuprella. The areas of the site are linked directly on the home page map. Clicking on a link will change the content in the central content box.

Genes Sausage Shop – Here’s another good example of incorporating the site’s theme into the navigation menu design.

NickAd – This one may seem against every design principle of an effective navigation menu but it gets points for creativity and innovation. As one review site puts it, it’s “probably not the most practical menu available but certainly one of the coolest.” I agree; a first-time visitor may be caught off-guard by the seemingly unintuitive design but trust me, it will wow you.

CL Designz – The main navigation menu at the top of the page may not look like much but you will surely love and appreciate its secondary menu located on the right side. It is unique, fun and definitely practical.

Manic Design – This one’s definitely one of my favorites on this list. It is nicely positioned on the left and all of the options are always visible, animated, and best of all, responsive!

C & C Coffee – There’s just something visually pleasing and amusing about its fun Flash-based menu as it playfully dangles links from the top of the page.

Alexarts – True to its nature, this graphic arts site uses menu items that appeal to modern aesthetics that are also fun to interact with.

Tennessee Trains & Byways – Don’t let the discreet menu at the top of the page fool you — Tennessee Trains & Byways is in contention for the largest dropdown menu in the world. It manages to combine old-world elements with modern design, resulting in a charming and highly interactive menu and page layout.

Incoming search terms for the article:

creative navigation bar

25 Professional High-Quality Free Fonts

Marvin@Blogfreakz — Fri, 27 Jan 2012 03:07:51 +0000

Finding high-quality fonts is quite hard since there are tons out there that are mostly ‘fillers’. But the following list of free professional fonts is excellent for graphic art and web design use, and I hope you find it helpful.

Incoming search terms for the article:

Minimal Portfolio Site Layout Free PSD

Mufti Ali — Sat, 18 Jun 2011 13:27:15 +0000

Today we are excited to release a new freebie resource. A simple, professional and minimal portfolio site layout. We are releasing this free resource in a fully layered PSD file. This stylish resource is offered exclusively on ahmadhania.com

Incoming search terms for the article:

Dark Menu Free PSD

Mufti Ali — Sat, 28 May 2011 10:21:56 +0000

Today we are excited to release a new freebie resource. A free simple website dark menu. We are releasing this free resource in a fully layered PSD file. This resource is offered exclusively on ahmadhania.com

High Quality Icons Mega Roundup: Creative and Specialized Sets

Mufti Ali — Sat, 30 Apr 2011 02:13:45 +0000

The purpose of an icon is to bring flair and life to a menu or navigation by replacing text with a recognizable image. These unique icons are incredibly detailed can often be used as desktop icons, or folder icons.