Huzzah! We've released a brand new WordPress theme called Statesman. Check it out!

Growl Notification Style

Download

Downloaded 30,367 times

Today’s freebie is something a little different, a Growl notification style. If you use Growl and want to spice up the notices, perhaps this one is for you.

If you’re a Mac user you may already be aware of Growl however for those of you who aren’t, it’s a notification system applications can use to tell you when things have been done. And you can style it. Nice!

Included in the download is the PSD needed to make any edits and of course the coded Growl style ready to be put to use straight away. Double-click the style icon (after downloading) to install and configure it within your Growl preferences. Enjoy!

63 Comments

  1. i really don’t konw how to download the psd,and where is the download button?

  2. Hey, I just downloaded the files. In your article you said:

    “Double-click the style icon (after downloading) to install and configure it within your Growl preferences. Enjoy!”

    But there is no style icon …. So what do I have to do?

    • Once you have unzipped the download you will see an icon like so http://cl.ly/9jfo – this is the icon you would double click to install. You need to be using a Mac as Growl is a Mac application.

    • Yeah I know, I am a (proudly) mac user. But after unzipping the zip file, all i see is this:

      notification.psd
      PremiumPixels.growlStyle
      preview.jpg
      readme.txt

      So as you can see, my system doesn’t interpret the files as clickable app. Its just a folder with these files listed.

    • Try changing finder to view items as icons rather than a list. View > As Icons. Ensure you have Growl installed already.

    • Oh okay, sorry my bad. I thought Growl is a build-in OS X application. Just installed growl……. now it works *facepalm*

    • Pascal, you would double-click the file, “PremiumPixels.growlStyle” to install the style. But, you need to install Growl first.

      http://www.growl.info/

  3. Margaret-Ann

    I have absolutely no use for this as I use windows.

    • No, I don’t suppose you would. But, you may be able to find inspiration in the design perhaps.

    • Joshua Stone

      Great comment, Margaret-Ann! A+ Would read again.

    • iamchrisclark

      Ever used a mac? If not, I (and millions of other people) recommend it.

    • Jonathan

      I’m sure Orman will consider a full refund :)

  4. CodeMonkey

    This is EXCELLENT!

  5. oh,i see it’s my browser’s problem

  6. First of all: thanks for all the great inspiration and the marvelous work.

    Second: what about the items in the menu bar? Especially the cursor-tornado-thingy interests me. Anything very useful for workflow (which could be a special subject itself…whatever)? :-)

  7. Good one, great work ;)
    And greetings from Greece.

  8. Wow, Can you make a background from the part that u are using as background all ready? totally would like to have that!

  9. Hi Orman, thanks so much for the wonderful theme. My problem however is that the notification is not extending beyond 2 lines, so when I get tweets, for instance, it shows only 2 lines. What can I do to make it extend please ?

    Thanks !
    twitter: @t87

    • That’s right, it’s fixed at two lines on account of the arrow and icon out-of-the-box design. For unlimited height you would need to lose the arrow and re-code the style.

    • Christian

      @Orman
      “Smokestack” is pretty similar and it works with unlimited height so I guess this is fixable.
      As is it looks great but it doesn’t really work to well ;(

    • Smokestack works because it doesn’t include a gradient. You are more than welcome to build upon this style to include variable height if you can find a solution.

    • Jonathan del Strother

      I’m a bit late to the party, but if you were to replace the #background css with this –

      #background {
      border-width: 30px 6px 7px 72px;
      -webkit-border-image: url(“images/notify_bg.png”) 30 6 7 72 fill stretch;
      box-sizing: border-box;
      overflow: hidden;
      }

      - then the image resizes nicely to fit around multiple lines of text.

  10. This is really lovely, Orman. Thank you.

    I can’t help but ask, could you please include a non-icon version ?

  11. Hey Orman, nice work. Will this pretty little notification style update Growl automatically for me every 2 days too? : )

  12. Schlomo

    Hi,
    This design is *awesome*! I have a question though. I’m trying to reposition the arrow to be on top. How can I combine the paths of the two raw layers to make something like the base layer (with the arrow repositioned)? What option(s) in Photoshop will combine the paths?

    Thanks,
    Schlomo

  13. Another coda user! love the look of the notifications, just might have to incorporate it into my webapp.

  14. viqueen

    Awesome! You’re the best.

  15. This is such a pretty piece of design Orman! Was looking for something like this for ever so long….will replace the icon with something more personal.

  16. Hey Orman, first of all, great theme for growl. But there is one little thing different from te screenshot you take, you’re text is bolder than on my screen, any idea to make it bolder? check ( http://cl.ly/1v3h2E3m0n292q100f1G )

  17. Thanks for this theme :)

    You’ve been featured on iconpaper !

    PS : Does it work on Lion? http://www.iconpaper.org/growl-notification-style/

    • Yep, works just fine on Lion. Thank you for the feature.

    • Jeff

      I have a fresh install of Lion, and I reinstalled Growl, just in case, but this doesn’t “preview” in the System Preferences, and Notifications don’t seem to display with this style. I wonder what’s up…

      Love it, though. I’ll let you know if I figure it out. Thanks!

    • Jeff

      Nevermind! If you have problems with Lion/Growl, remove the plist in ~/Library/Preferences containing “growl” (and the lock file). Re-open System Preferences and you’re good to go!

    • Federico Holgado

      Thanks, that did the trick! Happened on my 2 computers running Lion though, might want to add something on the post for future downloaders!

  18. Best Growl theme evar. Nice job.

    In the screenshot what application is the cloud icon?

  19. This is amazing. Thanks so much Orman!

  20. Christina Gillick

    This is great! Love it! Thank you!!

  21. Brilliant! Thanks for sharing that :0

  22. This would be great if it wasn’t fixed height.

  23. I was curious as to what background you have? I was looking for some green backgrounds this afternoon.

  24. Vitor Perez

    Jeff, you’re totally right! thank you!

  25. I am loving this! I can easily recognize Skype contacts or which app triggered the notification immediately. Thank you!

  26. Hello, fantastic theme. How i can just get rid off the icons on the left please ? An iconless version in fact :)

    Thank you.

  27. Christian

    This one looks really great. I would love a light version for Lion though … similar to Growling Lion (See http://quickcalapp.com/goodies/)

  28. alanariley

    Very nice!!

  29. This is fantastic. Thank you so much!

  30. Absolutely love it. Is it possible to position it bottom right instead of top right though?

  31. Love love love this, Orman. Thanks!

  32. great theme, thanks Orman :)

  33. Great work once again Omar, always on point! Cheers bud.

    • Pierre

      Orman* – lol not quite sure how that happened. Thanks!

  34. Wow!
    You just made my mac look so much better,
    Thank you!

  35. Sulaiman

    I really love this Growl Skin! but i want to suggest you to make with animated it would great!

  36. this is great one man from my side a Coffee to you

  37. You should probably replace the batteries in your mouse pretty soon.

  38. Thanks you, This is even more beautiful now

  39. Thank you very much for the wonderful materials. Fatali

  40. Omg, I didn’t know that we can put custom styles on Growl. Thank you so much, this is gorgeous

Leave a Comment