Gradients in Cocoa

CGShadings are a pain, or well, lets just leave it at all of Core Graphics (CG). While CG is a heck of a powerful library… It always seems to take an elaborate amount of code (as well as time, if your not yet acquainted with it) to do some of the simplest little things. For a discussion on creating gradients with CGShading go here.

cocoa gradient

Now, AppKit provides a pretty decent layer of abstraction, but I find that there are still a number of holes in its coverage of those lower level APIs that could use some filling.

One of those that AppKit doesn’t cover (that it really, really should, especially given the whole resolution independence thing that’s in the works – 10.5 maybe? please?), are gradients.

When I started coding up a sourcelist (you know, the tableView with the iTunes/iPhoto/Mail styling) and also thinking of a few of the mini-projects that I had plans for, many of which could use gradients also – I figured that I might as well take a little detour and try my hand at filling in that gap.

And so, let me introduce you to my little Cocoa Obj-C Gradient class, CTGradient. It’s a small class that should provide a decent cocoa interface for CGShading.

In my case, CTGradient has gone a long way toward making the code in several of the projects I’ve been working on significantly less cluttered (and that’s always a welcome change). I no longer have lines of GCContext junk in my drawing functions nor do I have CG function callbacks proliferating my code. The few convenience methods that I tacked on help a bit with readability as well.

Download CTGradient
< 100 KB

And so, that said, I figure a few people might find it handy.

As it stands right now, it’s not quite finished (I expect the interface to change by a fair amount in the not to distant future – I have a few additions to make). But in any case the code is stable, so if it does what you need it to do, go ahead and make use of it!

With that I’ll end with a short list of those additions I have plans to make:

  • Radial Gradient (just need to figure out best method interface)
  • Chromatic blending (blending HSB)
  • CTGradientWell (counterpart to NSColorWell – with palette to boot)
  • CTGradientSlider/Selecter? (view to let you add/remove/adjust color stops)
  • Miscellaneous methods for color stops
  • More pre-made gradients styles

Update: Updates and other info will be maintained at
Update: With OS 10.5’s AppKit, I would recommend using only NSGradient.

45 Responses to “Gradients in Cocoa”

  1. Hey, this looks really neat, Chad. I have a class very similar to this that I use in my projects, but yours has support for multiple stops, which is very cool. My only criticism on the code thus far: why are you capitalizing the names of your class methods? (+ AquaSelectedGradient, etc) Otherwise, stellar work.

  2. Chad Weider says:
    why are you capitalizing the names of your class methods?

    you know, I have no idea…Fixed

  3. I’ve got a Cocoa Gradient example class here:

    Good to see more people using Quartz Gradients.

    BTW. Your security code is almost impossible to read.

  4. Jason Jobe says:

    CTGradient is most cool. Its great for making slick backgrounds for Dashboard -like panels.

    Any chance you could add corner rounding to the rectangle? :-)

    thanks, Jason

  5. [...] Recently though, I started playing with CTGradient, a class for easily drawing gradients in Cocoa. Through this I’ve gotten interested in custom UI drawing and so I started a fun project to play with: XP Style Controls in Cocoa. [...]

  6. The best Cocoa UI components…

    The following list documents my favorite Cocoa controls on the Mac. These are all consumable by Cocoa applications, and will make your application look and feel far better than it would if you kept to the stock set of controls….

  7. [...] Secondly is abstraction. The shader draws, that’s what it does. If you’re using CTGradient today and want to switch that to something else in the future you change it in your gradient shader and you’re done. You can even use different gradient shader implementations depending on platform if you want. Uh, you know, if that was something that’d make sense. [...]

  8. Jason says:


    Very nice class but it does have a few memory management bugs in managing the linked list of gradient elements. I think it would be better as its own Class.

    That said, however, I’m doing my best to fix it as designed.

    I am also nearing completion of a gradient inspector that I’m willing to donate.

    Drop me a line and let me know what the current status is and what I should do with my updates.

    very best regards, Jason

  9. Chad Weider says:

    Jason- I certainly would like to hear about any bugs you may have found in my code. As soon as I can find them you can be sure I’ll issue up a patch.

    A gradient inspector? cool – I would be interested to see it.

  10. [...] Fancier gradient fill shaders, CoreImage based shaders and that kind of thing are left, for now, as an exercise for the reader. I mentioned it in the original post but if you’re looking to do gradients you’d do yourself a favour by looking at CTGradient. [...]

  11. Graham Cox says:

    Hi Chad, just wanted to give you a heads up on a new framework we’ve just released which takes your gradient class concept to a new level. While we haven’t borrowed too much from CTGradient, some parts were originally ported from there so we’ve credited you in our UI and docs.

    Our site link is

    Graham Cox and Jason Jobe

  12. [...] StyledWindow is a subclass of NSWindow created by bithaus. It’s uses the nice CTGradient code created by Chad Weider. [...]

  13. [...] From CTGradientView: CTGradient *aGradient = [NSKeyedUnarchiver unarchiveObjectWithData:[NSKeyedArchiver archivedDataWithRootObject:myGradient]]; [...]

  14. [...] have to write Javascript code. Share also uses RSVerticallyCenteredTextFieldCell by Daniel Jalkut, CTGradient by Chad Weider, and VariableCellColumn by Corbin [...]

  15. [...] Chad Weider’s CTGradient is quite nice. Check it [...]

  16. johnny says:

    Is it possible to apply a gradient to the stroke of an NSBezierPath object?

  17. [...] can be misguided, let’s review why CTGradient was, at the time, created to begin with. It was first introduced in January ‘06, and the first three paragraphs lay out the rationale for the existence of this class: While [Core [...]

  18. [...] Ankur Kothari wrote an article dissecting CTGradient. [...]

  19. [...] been a furore recently over an article by Ankur Kothari where he optimized CTGradient. As an exercise in optimizing code, it was fairly aggressive but otherwise pedestrian. As an [...]

  20. [...] Fancier gradient fill shaders, CoreImage based shaders and that kind of thing are left, for now, as an exercise for the reader. He mentioned it in the original post but if you’re looking to do gradients you’d do yourself a favour by looking at CTGradient. [...]

  21. [...] is abstraction. The shader draws, that’s what it does. If you’re using CTGradient today and want to switch that to something else in the future you change it in your gradient shader [...]

  22. [...] Fancier gradient fill shaders, CoreImage based shaders and that kind of thing are left, for now, as an exercise for the reader. I mentioned it in the original post but if you’re looking to do gradients you’d do yourself a favour by looking at CTGradient. [...]

  23. Paul Sanders says:

    Utterly brilliant, thank you so much for posting. NSGradient is fine (well, it’s a bit limited) but I don’t want to write code that will only run on Leopard – there are still plenty of Tiger machines out there .

  24. Mike says:

    I subcalled CGGradient to make my own view and made a cutom NSView in IB and set its type to CGGradient and added an outlet to my window controller for the subclassed view, and hooked everything up.

    But when I run my app, the gradient never shows up. What else do I need to do in my subclass?

  25. [...] CTGradient – This is a simple class that wraps all the nasty bits of creating gorgeous gradients on OS X. It also appears to be the new hotness in that I’ve seen a ton of projects incorporating this over the past few months. I am definitely looking forward to including this in iRooster once I drop support for Panther. [...]

  26. Bill Allen says:

    chad…I see where you contributed to the Neat program. Perhaps this is not your area of expertise but I wonder if you could tell me why the Neat Library indexes every time it is opened? Apparently Neat tech support has no idea! Some history: This constant indexing only started about 2 months ago when using ver: 4.0.1. Now, upgrading to 4.0.2, the same thing happens. I am very frustrated and I am hoping you might be able to be of some help. Thanks…Bill Allen

  27. Excellent site you have here but I was curious if you knew of any community forums that cover the same topics discussed in this article? I’d really like to be a part of community where I can get feed-back from other knowledgeable individuals that share the same interest. If you have any recommendations, please let me know. Cheers!

  28. says:

    It is quite a challenging task to pick the right junkyard. One can very easily find various junk removal companies. Venturing to a business that involves making custom cars.

  29. Hi, i reаԁ ʏouг blog from time to time and i own a similaг оne and i was jսst curious if yoս get a lot of spam responses? If so how dο yoս stoƿ it,any plugin or ɑnything you сan recommend? I get sso much lately it’s driving me insane sο any support іs very mսch appreciated.

  30. Excellent site you have got here.. It’s hard to find quality writing like yours nowadays. I really appreciate individuals like you! Take care!!

  31. From this cause we also supply bodybuilders with recovery drugs required for steroid post cycle therapies.

  32. A handful of remaining healthcare uses consist of therapy of some kinds of anemia, severe burns, and some types of breast cancer.

  33. Appreciation to my father who told me about this web site, this website is really amazing.

  34. Hung says:

    Dr. Smith is the messiah to cure you from your herpes virus, just as he was mine. contact him dr. smithherpesherbalcentre call or @.

  35. Nice post. I learn something new and challenging on websites I stumbleupon everyday. It’s always helpful to read through articles from other writers and use a little something from other web sites.

  36. Buy original Opium fragrance at discount. Other people’s viewpoints regarding Opium Perfumes: I initially received it as a gift from my children. Discount rate perfumes at fragrance. Delighted browsing!

  37. I enjoy wwhat you guys are usually up too. This tpe of clever work and coverage!

    Keep up the terrific works guys I’ve included you guys to ourr blogroll.

  38. And while you’re within the retailer, take a whiff on the Carriere Freres candles, especially Lily of the Valley.

  39. Dewey says:

    This is my first time go to see at here and i am truly happy to read all at alone place.

  40. Eulah says:

    Hello colleagues, its impressive paragraph on the topic of tutoringand entirely defined, keep it up all the time.

  41. It’s an remarkable paragraph in favor of all the online people; they will obtain benefit from it I am sure.

  42. Hi there mates, how is the whole thing, and what you would like to say on the topic of this piece of writing, in my view its genuinely awesome in support of me.

  43. says:

    Nice post. I used to be checking constantly this weblog and I am impressed! Very useful information specifically the ultimate section :) I take care of such info much.

    I was seeking this certain info for a very long time. Thank you and good luck.

  44. Not to say that the flappy paddle versions aren’t nice, but that 6 speed is honestly the best transmission I’ve ever That’s the real shame that they did away with the manuals, they literally killed off my favorite

  45. My attempt to truly ELI5 this took a lot time to trim down : GoPro "squishes" video to make it fit into small SD Big cameras do not, so editors can greatly control color in the video to add style/convey GoPro can’t see very bright, or very dark Big cameras Big cameras can also show darker/brighter parts of a single image, allowing for beautiful/detailed shots of sunsets for GoPros will show a sunset as a single, "blown out" spot, while Pro cameras show all the subtle detail our eyes can GoPro doesn’t have interchangeable With control over a lens, you also have control over what is in focus in the Focus control is the first big thing audiences distinguish between "pro" and "amateur" A video with the actor in focus, but his background tastefully blurred out of focus creates depth and GoPros are also stuck with a very **wide view of the Lenses allow filmmakers to chose how wide, or narrow they’d like their shots to Lenses can also allow cameras to see very distant, or very tiny objects with stunning GoPros can’t connect to all the cool accessories that filmmakers Special accessories allow filmmakers to have much longer battery life, provide focus control to a separate operator, help stabilize the camera, record professional sound, provide bigger screens with built in tools to help set focus/exposure, There are a millionbillion other reasons, but these are some of the

Leave a Reply