Free Fading Corner Images

January 18, 2007 | Posted in Freebies | 92 Comments »

I see more and more fading corners every day, so I decided to put together some freebies, since they are becoming popular.

You will notice that all of these are white, but I included a Photoshop source file in each download so you can customize them. It seems to me that a lot of people are looking for these so, I thought I would do a good deed and help everyone out.

I tried to mix up the sizes a bit by making 2 different corner radii, as well as vertical, horizontal, and 2 border styles. If you like what you see here, and you absolutely do not have a way to customize it, leave a comment and specify a color in hex format, and I’ll see what I can do.

Web 2.0 Fading Corner 6

Note: The .png’s provided here have transparent backgrounds so you can place them on top of any color you want. (Some browsers don’t support .png transparency, I suggest customizing the psd and saving you own image if you need a different color.)

Download ALL at once:

Download

Does not include Requested Colors. Download those seperately.

4px Radius Corners:

1. [308 X 150] 4px Corner radius, 1px fading stroke #CCCCCC

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 1

2. [332 X 127] 4px Corner radius, fading drop shadow

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 2

3. [246 X 198] 4px Corner radius, fading drop shadow

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 3

4. [120 X 150] 4px Corner radius, 1px fading stroke #CCCCCC

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 4

8px Radius Corners:

5. [326 X 160] 8px Corner radius, 1px fading stroke #CCCCCC

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 5

6. [370 X 184] 8px Corner radius, fading drop shadow

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 6

7. [370 X 240] 8px Corner radius, fading drop shadow

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 7

8. [119 X 146] 8px Corner radius, 1px fading stroke #CCCCCC

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 8

Related Posts: Web Design Trend: the fading corner

REQUESTED:

1. [398 X 248] 8px Corner radius, fading drop shadow, background color #6699CC

Download

Download Includes: .psd, .gif, .jpg, .png

Web 2.0 Fading Corner 9

Related Posts: Web Design Trend: the fading corner, CSS for Fading Corners

This entry was posted on Thursday, January 18th, 2007 at 7:08 pm and is filed under Freebies. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
Stumble It
Add to Del.icio.us

92 Responses to “Free Fading Corner Images”

  1. Jon Zencovich Jan 19, 07 at 11:14 am

    Giving back to the community eh? It’s truly appreciated buddy. Any little thing helps. Keep up the good work!

    –Jon Z

  2. mcd Jan 19, 07 at 12:18 pm

    so, how does one use these?

  3. JaCat Jan 19, 07 at 12:48 pm

    por favor make with background #6699CC… gracias!~

  4. baldo Jan 19, 07 at 1:33 pm

    goooooood job :)
    (visit my site for some ajax gif icons)

  5. Matt Jan 19, 07 at 1:35 pm

    Just one thing.
    Please, please, please don’t call this “Web 2.0″.
    How does it have anything to do with Web 2.0?
    Sure, it’s a trendy design element, but it is in no way related with “Web 2.0″.

    Thanks for sharing though.

  6. P3nd3Ho Jan 19, 07 at 1:37 pm

    now can you show me how to use them?

  7. The Web Design Blog Jan 19, 07 at 2:44 pm

    [...] Just a bunch of images for use on fading corner effects. All free. Link « PHP programming basics   [...]

  8. Ian Jan 19, 07 at 2:55 pm

    Hey thanks for the files. Also I was curious whether you have any special settings for outputting files with transparency. I’ve tried it a few times and i seem to get ugly sharp edges and other problems.

  9. DesignStage.Net Jan 19, 07 at 3:06 pm

    hmm….thanks…

  10. IAMWW | blog / links for 2007-01-20 Jan 19, 07 at 7:39 pm

    [...] BittBox ? Web 2.0: Free Fading Corner Images (tags: CSS design corners graphics webdesign web2.0 images WebDev free howto HTML image resource resources tips tricks web photoshop development) [...]

  11. Luis Jan 19, 07 at 8:07 pm

    I plan to use this, if possible. Demo, please.

  12. CH Jan 19, 07 at 10:45 pm

    Son tan elegantes que estoy considerando incorporarlos en el dise?o de mi sitio.

    Saludos

  13. siong1987 Jan 19, 07 at 10:54 pm

    This helps me to create my new theme for my blog.

  14. Joshua Powell Jan 20, 07 at 1:16 am

    You have saved me some time – I was just about to make some of these for some new sites.

    So thanks!

  15. bittBox Jan 20, 07 at 1:24 am

    There is a new post on how to use these images with CSS:

    http://www.bittbox.com/?p=94

    ~bittbox

  16. ?????? ??????? ??? fading corners : Webzone Jan 20, 07 at 11:25 am

    [...] ??? Bittbox ???? ??? ???? ????? ??????? ?? fading corners ??? ?? blog ? ?? site ???. ?????? ????? ??? ?????? ?? design (web 2.0) ???? ????? ?????? ????????? ? ?????????? ????????? ?? ?? ????? ??? download ???? ???? ????? ??? ??????? ??? ??? ????? designer ?? ?????? ?? ?? ?????????????? . Tags:blog css Design web 2.0 [...]

  17. Vic Jan 20, 07 at 9:51 pm

    You have been dug!!
    congrats

  18. sastgroup.com » Blog Archive » Free Fading Corner Images Jan 21, 07 at 8:12 am

    [...] Link: http://www.bittbox.com/?p=84 Share and Enjoy:These icons link to social bookmarking sites where readers can share and discover new web pages. [...]

  19. Jonathan Ploudre Jan 21, 07 at 2:38 pm

    If appears that these files are much bigger than they need to be. Maybe they have the resource fork for a Mac. I resaved the gif as web ready and the size dropped from 44 kb to 2 kb.

  20. Charles Jan 21, 07 at 7:07 pm

    I’m just learning web design. Thanks for making things like this available so that non-professionals like myself can make use of them.

  21. JaCat Jan 22, 07 at 8:16 am

    gracias! Salud BittBox!

  22. baldo Jan 25, 07 at 1:01 am

    u deleted my comment?
    :P

  23. bittBox Jan 25, 07 at 4:54 pm

    Baldo, if I did, I assure you it was not intentional, and I appoligize.

  24. The Lab47 » 10 CSS guider Jan 26, 07 at 3:17 am

    [...] Link [...]

  25. Verblassende Eckbilder at ogeeBloggin’ Jan 31, 07 at 12:59 pm

    [...] voneinander abgrenzen… BittBox bietet 8 unterschiedliche Beispiele zum kostenlosen Download [...]

  26. links for 2007-01-23 en newdisco Jan 31, 07 at 5:39 pm

    [...] BittBox ? Free Fading Corner Images Descarga gratis de esquinas redondeadas. (tags: roundedcorners rounded+boxes rounded) [...]

  27. Lucas Feb 3, 07 at 8:12 am

    Nice! I used them on my site. The site is still work in progress and the fading corners where a very big help. My site can be found at http://www.forensischepsychiatrie.nl

  28. xocea » Web Design News: January 2007 Feb 6, 07 at 7:37 pm

    [...] Web 2.0: Free Fading Corner Images for your CSS [...]

  29. JULIAN Feb 17, 07 at 9:58 pm

    hola, hello quiero download

  30. Bulent Feb 21, 07 at 11:37 pm

    Good job. Thanks..

  31. john krieger Feb 26, 07 at 7:26 pm

    Qoute” :Note: The .png?s provided here have transparent backgrounds so you can place them on top of any color you want. (Some browsers don?t support .png transparency, I suggest customizing the psd and saving you own image if you need a different color.)”

    Png are supported via a hack in IE. Check out 1penguin.com/mps/index.html for an example of how png can handle in IE with a Java script hack. Firefox does handle PNG’s without any browser hacks.

  32. links for 2007-01-20 - IAMWW Mar 3, 07 at 1:30 pm

    [...] BittBox ? Web 2.0: Free Fading Corner Images [...]

  33. RubixCube Mar 12, 07 at 1:38 am

    Ummm….just to let you know….the download buttons….aren’t linked to anything!!

    So, yeah….and “right-click” > ‘Save Image As…’ doesn’t do any good because the images shown are .jpg….

    Just thought I’d bring it up…

  34. Mode Noir Mar 26, 07 at 9:11 am

    I’m REALLY new at illustrator and wanted to try my hand at making these things. It took me quite a while to get it down and I’m wondering if there was an easier way to make them. Here’s what I did:

    I made a rectangle with a white fill and 1px faint grey stroke, then applied a drop shadow with the desired effect. I then created two white rectangles with no stroke to cover the right and bottom sides, as I found that deleting the paths just made it a weird triangle with the dropshadow along the slant. I then created an opacity mask for the top with a white to black gradiant, as well as for the left side.

    Mind you it took me about an hour to figure out how to do all that, and I could probably recreate it now in a couple minutes (though I haven’t figured out the best way to try the colored background with it, though I have an idea). Is there a quicker / cleaner way to achieve this styled corner?

  35. ohnzqspeaw May 27, 07 at 5:08 am

    Hello! Good Site! Thanks you! xxqfoepbhawz

  36. vgzrlqskfe May 27, 07 at 10:14 pm

    limbke

  37. 30 Resources to Create Your Own Web 2.0 Site - Simplehelp Jun 20, 07 at 5:31 pm

    [...] bittbox – fading corner images [...]

  38. website designing delhi Jun 27, 07 at 12:34 am

    thanks

    Really good resoures. easy to use and implement

  39. Abu Jul 8, 07 at 6:43 am

    Very generous! Thank you.

  40. Rub?n Casalta » Free Fading Corner Images Jul 11, 07 at 12:41 am

    [...] –>> Panxo pinxa <<– [...]

  41. Web 2.0: Free Fading Corner Images for your CSS « See the Post Jul 31, 07 at 10:53 pm

    [...] read more | digg story Posted by seethepost Filed in news [...]

  42. ?????? ??????? ??? fading corners | Webz Aug 13, 07 at 3:42 pm

    [...] Bittbox ???? ??? ???? ????? ??????? ?? fading corners ??? ?? blog ? ?? site ???. ?????? ????? ??? ?????? ?? design (web [...]

  43. epasser Sep 16, 07 at 9:06 am

    that’s what I need

  44. Tuesday Nov 21, 07 at 3:06 am

    Hi.

    I tried changing the color to light blue but it seems like it lost the fading effect.

    Also, I am trying to make a background (just a rectangular jpg image that will be placed in powerpoint). It should be fading on the sides such that its colors are mixing with the backgruound of the ppt.

    Hope you can help me. Thanks.

  45. Sikandar Aazam Nov 26, 07 at 4:38 am

    Really good resources. Thanks you!

  46. Anewlis | Portfolio » Blog Archive » The 50 Most Popular Web Design Blog Posts, Resources & Cheat Sheets of 2007 Jan 4, 08 at 10:28 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  47. The 50 Most Popular Web Design Blog Posts, Resources & Cheat Sheets of 2007 « arcagility Jan 14, 08 at 4:01 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  48. 2007?????50??????????????? | ????? Jan 14, 08 at 4:48 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  49. Estetik Jan 22, 08 at 6:34 pm

    thanx

  50. Download Devanagari Fonts, Chinese Fonts, Graffiti Fonts Free | Download Web 2.0 PSD Source Files Feb 1, 08 at 10:20 am

    [...] bittbox – fading corner images [...]

  51. Foxinni - Wordpress Designer Feb 2, 08 at 9:07 am

    Insane post. Very nice preset corners. Saving the link right now!

  52. Readerslab » The 50 Most Popular Web Design Blog Posts, Resources & Cheat Sheets of 2007 Feb 26, 08 at 5:48 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  53. Real Estate Postcards Guy Feb 28, 08 at 4:40 pm

    that’s what I need too! You guys are super awesome!!

  54. 2007?????50??????????????? | Blue apps ! Mar 12, 08 at 4:22 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  55. vishal Mar 13, 08 at 1:57 am

    I got exactly what I was looking for … it is really good contents… thanks a ton!!

  56. Trisha Mar 15, 08 at 5:05 pm

    You rock! Thank soooooooooooooo much for doing this!

  57. Roundup of Free Graphics/Icons/Background Generators | Mar 30, 08 at 9:11 am

    [...] Free Fading Corner Images [...]

  58. Got an <idea>? » Blog Archive » Fading hoeken Apr 29, 08 at 6:54 am

    [...] Hier kun je zien hoe! [...]

  59. BMD-Media.com May 1, 08 at 12:15 am

    Those add a nice touch to any design

  60. Travesti May 29, 08 at 7:42 am

    thank!

  61. lazer epilasyon May 29, 08 at 7:43 am

    thankkk

  62. Elektronik sigara Jun 6, 08 at 10:23 am

    Elektronik sigara !

  63. AJ Nguyen Jun 13, 08 at 5:53 am

    Hi these are really good
    i want to ask do you know of Transparent psd files, an example would be a album cover they would have a broken glass effect on it…. would you have any by any chance or know where i can get it message me if you got information my email is
    aj_nguyen@hotmail.co.uk

  64. tala Jun 27, 08 at 9:11 am

    Hi these are really good

  65. y?lan ya?? Jun 27, 08 at 9:11 am

    Hi these are

  66. Adobe Photoshop: 50+ High Quality .PSD Files and Tutorials Aug 10, 08 at 11:59 pm

    [...] 49-Free Fading Corner Images [...]

  67. Türkiye Süper Ligi Aug 14, 08 at 10:04 am

    thanks..

  68. Adobe Photoshop: 50+ High Quality .PSD Files and Tutorials | Liteforward Aug 15, 08 at 6:44 am

    [...] 49-Free Fading Corner Images [...]

  69. Download Web 2.0 PSD Source Files : Top 10 Webhosting Rating Oct 21, 08 at 5:48 pm

    [...] bittbox – fading corner images [...]

  70. Web Line Nov 12, 08 at 5:14 am

    Really great collection, thanks.

  71. s?cak Nov 22, 08 at 9:21 am

    Baldo, if I did, I assure you it was not intentional, and I appoligize.

  72. 2007?50????????? - Design Thinking Nov 22, 08 at 11:35 pm

    [...] 99 sites to check out is a must-see for anyone looking to sharpen their technical graphic skills. Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some [...]

  73. ?? ???? » ??? ?? 50 ???? PSD ? ????? ?????? Dec 2, 08 at 3:05 am

    [...] 49-Free Fading Corner Images [...]

  74. Adobe Photoshop: 49 High Quality .PSD Files and Tutorials | Design it Dec 16, 08 at 10:12 pm

    [...] 49-Free Fading Corner Images [...]

  75. Free Web Design Tips Apr 15, 09 at 3:18 pm

    [...] corners look really cool and can make things really pop. This website here has a lot of options and they are all free to download. Posted by Tarraguña Web Design [...]

  76. ??? WordPress ?? » Blog Archive » The 50 Most Popular Web Design Blog Posts, Resources & Cheat Sheets of 2007 May 3, 09 at 6:34 pm

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  77. Free Vector Fading Corner | BittBox May 7, 09 at 11:26 pm

    [...] is a follow-up to my Free Fading Corners post, which was apparently very well received by a lot of you. I’ve put together a fully [...]

  78. The 50 Most Popular Web Design Blog Posts, Resources & Cheat Sheets of 2009 | HKWebDesignBlog.com May 16, 09 at 12:13 pm

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  79. 80?????????, Blog??, ????, ?????? | HKWebDesignBlog.com May 17, 09 at 6:26 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  80. web design leeds May 20, 09 at 1:53 am

    cheers!.. saves me some time in the future.

  81. 50 Most Popular Web Design Resources for 2009 | HostSG - Singapore Web Hosting Company Jun 2, 09 at 4:09 am

    [...] Free Fading Corner Images – Who can turn down free corner images? Bittbox hooks it up once again by giving designers some trendy fading corners for our web2.0-ified site. [...]

  82. EPC London Landlord Jun 8, 09 at 8:12 am

    cheers.. will use this when i create my web site.

  83. burlesque performer Jun 17, 09 at 4:04 am

    excellent post!.. and an amazing website!.. so glad I stumbled accross this!.. cheers again

  84. india logo desiger Jun 27, 09 at 1:23 am

    good corner design in web site using

  85. robb Jul 26, 09 at 1:45 pm

    it looks really nice.
    thx for sharing.

  86. sinema izle Aug 17, 09 at 9:32 am

    cheers.. will use this when i create my web site

  87. Adobe Photoshop: 50+ High Quality .PSD Files and Tutorials | Downrex Sep 22, 09 at 6:21 am

    [...] 49-Free Fading Corner Images [...]

  88. Michael Oct 23, 09 at 7:30 am

    I downloaded the files but the PNG images do not have a transparent background.

  89. Mike Meisner Dec 10, 09 at 7:08 pm

    Wow thanks for this. I’ve seen them before and needed to figure out how to whip this up in PS today. Dissected one of yours and finally the light bulb lit up in my brain. Thanks bro!

  90. Prefabrik Ev Jan 26, 10 at 10:38 am

    guzel paylas?m tbrkler

  91. Al Kabin Jan 26, 10 at 10:47 am

    super cal?sma

  92. mattwi Feb 17, 10 at 3:54 am

    Nice one, gonna use this on my private site

LEAVE A COMMENT




Message: