Archive | Design RSS for this section

On Press Effect btn through css.

I want to make a btn (background image) effect in three different stage like.. normal, hover and press effect. Actually  I want to push btn inside in depth through css on mouse press. I was thinking that will happen with JavaScript and Ajax.. but when I tried with “a:active” stage.. that magic come up..

For that I cropped image as above and call them through background using “background-position” property.

So this was new learning for me in css. Here is that simple code to make such button effect:

Normal mode:

a.btnKnowMore {





margin:0px auto;



Hover Effect:

a.btnKnowMore:hover {


background-position:0px -28px;


Press effect:

a.btnKnowMore:active {


background-position:0px -56px;



A community website for designers

Do you want to submit your design work like mockup, wireframes, landing page & logo design etc and want to feedback from other designer around the world than submit your site and get the valuable feedback from other which help you to improve your skills.

Concept feedback a brand new community website for designers.

free wallpaper

Here I have created wallpaper. you can download it simply by clicking. This is my first wallpaper i will create more in future. Keep visiting my blog.

download this wallpaper here

How we can make orkut website more beautiful?

Orkut is very famous website on net for social networking. But I have question regarding their website designing. Currently design of orkut I don’t like. It is not good as I want, or as a designer want.

I think orkut-team should change their website design. It should be according web2.0 or latest trends.

So last few weeks I have above question in my mind. So I research on website on point of usability and designing. And finally I found some issues in current website like:

  • Logo is old fashion it should be according Web2.0
  • Font style is small and old. It should change to web 2.0 fonts like bigger fonts that makes website more readable.
  • Blue color is looks very dull in website.
  • square column in website looks also old fashion it should change to rounded.
  • Design should be column based.

After research I designed a sample page of Orkut, where all above requirements is filled in screen. You can see it here :-


What I did in screen.

  • I used new trends logo for Orkut. which is according Web2.0. It is plain and simple and it is easy to remember for visitors.
  • Used Arial font
  • Divided home page in three column.
  • Used blue vibrant color
  • Made top navigation bar at top for usability point of view.
  • New designed for Login area.

This is design which I like and I hope orkut’s user also like it. Give me your comments and suggestions on design-screen of orkut.

Collection of best websites

Here i am posting some best inspired website which i found till now.

css beauty

design snack cssbased

cssmania cssElite

cssRemix unmatch Style

Cool Photoshop Brushes



Here is link of Cool photoshop brushes. You can download it but before downloading please read term and condition carefully. You can’t use these brushes on designs for sale on stock photography sites.

I like this brushes good job by them. check this out.

Free Icons

I found a collection of free icons on wikipedia.

Check out this link :

Knowledge Is Free

Last few weeks I was searching a link for free e-book downloading and today shuklendu send me link of This web portal is place where user can exchange freely e-books, video training and other materials for education purpose. So you can download e-books for free of charge.

Web2.0 award for 2007

web2.0 award for the year of 2007

Web2.0 Award for year of 2007 has announced on May 9th 2007 by SEOmoz. There are 200 web2.0 website in 41 categories and 15 Interviews with Founders of Winning Sites.

Check it out at



Download free CSS & Xhtml templates from here. is one of the STUDIO7DESIGNS non profile companies which provide us some free xhtml & css templates with source file.