Let's look closely at a crucial and time-saving product for designers called Adobe Kuler. We’ll learn to explore, create and share color themes using the Kuler website and the built in extension of Kuler in Photoshop CS4. What’s Adobe Kuler? It’s a web-hosted application, providing free color themes that can be used by anybody, in any project you are working on. Let's jump into this article and learn more about Adobe Kuler and how to use it with Photoshop!
Introduction
How does Adobe Kuler work? What do I need? The only requirements, for using Kuler, are a Web browser with an enabled Flash Player 9 or higher, since it is Flash based. Additionally, you can access the Kuler extension from any Creative Suite 4 product or use the Desktop Air Kuler application.
Flash Player required
Kuler Website
Desktop Air Widget
Kuler Extension
Kuler - Creating, Sharing, and Using Color Themes!
Whether you are a design professional or a beginner, there will always be a situation, where it’s hard to find the right color theme for a project. This is where Kuler comes in. Kuler not only provides a huge number of color themes, it’s also build on an active community, which creates and publishes the color palettes we are talking about. Let's learn how to set up an Adobe ID, to log in to the Adobe Kuler website, to browse, save, create and publish your own color variations.
Setting up an Adobe ID account for access to Kuler
Well, you can use Kuler to experiment with colors and copy & paste the color values, but after signing in, you'll get access to download the Adobe Swatch Exchange files, which contain the color themes. It's always stressful setting up all these different accounts on different websites and keeping everything in mind, but Adobe did a good job on this one.
If you already have an Adobe ID, then you can easily login, using the Sign In button located at the top-right corner. You can also click on Register. Adobe will redirect you to their website and guide you through the registering process. After creating an account, come back to continue and login to Adobe Kuler.
Login
Go to the top-right-corner. Click on Sign In and insert your AdobeID and password, then click Go.
Register
Go to the top-right corner and click on Register. You'll be redirected to the Adobe.com website. Click on Create an Adobe account. Fill out the required information and come back to Kuler to Sign In the way described above.
Different Menus and Sections on kuler.adobe.com
Adobe Kuler is split into different sections. These sections allow you to add or retrieve certain information. Below you can see the single sections with short descriptions, accompanied by images.
Explore
- Menu
Explore color themes by either browsing or searching the Kuler database. You can sort listed themes by Newest, Most Popular, Highest Rated or other random options. By setting a time frame for your results, Kuler will only list themes, uploaded in that time span.
- Search
You can narrow down your search results by using the Search bar. You can search by tags, titles, creators or colors. To make it easier for everybody to find the themes you create, you should always choose proper tags.
Community
- Details
Color themes, found on Kuler, are submitted by the Community. By creating, saving and publishing your themes on Kuler you make them accessible to everybody. In this section other users can retrieve information about the creator, title, different tags and more.
- Comments
To give or get some feedback for your themes, add comments. Like on many other websites, you can read comments, but posting comments is only available after Log-In.
MyKuler
- MyKuler
The MyKuler section in this image is empty, that's because I've set up a new account, but after creating the first themes, you'll be able store, view, and retrieve all your saved and favorite themes here. You can save themes as favorites, while you are browsing through the database by clicking on the proper button in the details section. You can later import your saved themes to Photoshop.
Extras
- News and Features
This section lists information about the current products using or featuring Kuler.
Kuler - Features
Download a color theme as an Adobe Swatch Exchange file
After signing in, you can download the themes you like by clicking on the download Adobe Swatch Exchange file in the details section.
.ASE Files
This is how the downloaded files will look like. All Creative Suite 4 products support the exchange of colors via ASE files. For example, you can easily exchange single colors or themes you've created in Illustrator to a Photoshop project. In our case we want to import the files we've downloaded from Kuler.
Load Swatches
Go to your Swatches Panel, click on the little triangle in the top-right corner. Next Choose Load Swatches, then Select the proper File type and import it. That's it!
Post Comments
As mentioned above, being a member of the community not only gives you access to the color themes, but also provides commenting and rating which will later help Adobe organize the themes. To leave a comment, go to Add comment. Type in your text, then click submit.
Rate Themes
The five-star rating system shows you what the community thinks about the theme. High ranked themes will be listed and ordered when choosing Sort by Highest rated/Most Popular and will be featured on the home page.
Edit/Create Themes
So far, we've learned how to browse and download themes, but now we want to create our own color theme. Either click on the button you can see below to edit the current theme or click on Create in the menu to create a theme from scratch. Both will redirect you to the Create page. You can then choose between creating a theme from colors or an image.
Create theme from a Color
Create theme from an Image
Creating Your Own Theme
Kuler provides very efficient tools to quickly create new color themes. You can choose different harmony rules, use the interactive color wheel and different sliders for brightness and angle, extract colors from an image or simply input color values.
Base Color and Related Colors
Like the name says, you can choose a Base color and build the color theme around it. After setting the Base color, four other colors are available to choose. Harmony rules will apply to the base color and affect the colors around it. By dragging and dropping on the color wheel, you can adjust the base color. The other colors will then move simultaneously.
Color Rules
The color rules are based on color theory. If you are interested in the theory behind Kuler, check out the links provided below. After selecting the base color, select one of the following rules to quickly create harmonious themes. I think the best way to understand what any single rules does is to experiment with each of them. By selecting Custom, Kuler gives you the freedom to select colors individually.
Color Wheel
Move the markers on the interactive color wheel to choose the colors in your theme. Do this by either using a color rule or individually selecting colors. Below the color wheel is another Slider, which adjusts the brightness of the colors.
Color Values
If the color wheel is imprecise, you can additionally adjust the colors in your theme by inputting numeric values for the HSB, RGB, CMYK, LAB, or HEX color models. If you only want to change a single color, make sure Custom is selected, since entering a new value will adjust all the other colors in the theme. If you want to experiment with the theme, use the color sliders under each color swatch. For those of you who are not logged in, you can easily create themes and copy & paste the values to Photoshop or any other Software.
Color from an Image
A very neat feature of Kuler is the extraction tool which generates themes from an image. You can upload images from your desktop or use images from Flickr. Just as the harmony rules, Kuler provides different Moods: Colorful, Bright, Muted, Deep, Dark, and Custom. The moods you can choose from, will automatically generate appropriate colors. By moving the markers around, Kuler picks the color of the current position and displays it, below the image, in the color theme preview. Kuler supports TIFF, JPEG, GIF, PNG, and BMP image formats.
Saving and Publishing
Before saving your themes, you should always give it a proper title and tags to make it easier for other users to find. You can choose to save your themes in private mode to your MyKuler section or share them with other members, who can rate them and add comments. Tags and comments are displayed in the details section. Popular tags are displayed in a certain text size. The larger the size, the more popular the tag word. Creator's can set an avatar or personal color swatch as their default picture. Other members can click on avatars to view all the themes created by that member.
Using the Kuler Extension in Photoshop
Downloaded Adobe Swatch Exchange files can be used as color swatches in all Adobe CS4, CS3 and CS2 products. We'll take a look at Photoshop CS4.
Find and Open the Kuler Extension
With the new CS4 version, Adobe integrated Kuler right into Photoshop. You can find it by going to Window > Extensions > Kuler. The Kuler Panel will appear. In case you still don't know what Kuler is or how it works you can read the information, by clicking on the About tab. You can additionally read the Terms of Use and Privacy Policy if you are interested.
This extension provides access to Kuler via RSS feed's. The extension loads the themes directly from the online database. You can also log in to your Adobe account by clicking Window > Extensions > Connections, which will create a connection to Adobe services, while you are using Photoshop or any other Creative Suite 4 product.
Features: Browse and Create
Browse
The Browse tab reveals a list of currently uploaded and available color themes. To use this feature an Internet connection is required, since the extension uses a RSS Feed to read and list the color themes in Photoshop. You can browse, search and sort themes the way we did on the Kuler website. At the bottom of this section, you can see the arrows pointing up and down. These help you to view the previous or next sets of themes.
Create
The create tab reveals a smaller version of the Create Page on kuler.adobe.com. As you can see, these are the same functions like choosing a harmony rule, adjusting the single colors or brightness, setting the base and related colors and retrieving the values. At the bottom of this section there are additional buttons, which let you upload your theme directly to your account or download/save the current theme.
Swatch Panel
This is how the standard Swatch Panel looks like in Photoshop. You can open it via Window > Swatches. In a previous step we've learned how to import ASE files to our Swatch Panel. The extension makes it a lot easier for us. We can easily browse and directly add themes to our Swatch Panel though without downloading and importing ASE files from the Kuler website.
Directly Add Themes to Swatches
The button on the bottom-right-corner, adds the theme directly into your Swatches Panel. You can now select single colors as your Foreground or Background color and apply them to your project. You can reset or delete the colors by clicking on the little triangle in the top-left corner.
Using the Adobe Air Kuler Application
Download and Installation
So far, we've used the website and extension in Photoshop CS4, but as I mentioned before, there's a cool Air application which runs on your desktop. The only requirements for using it is having Adobe Air installed on your computer.
You can start the installation by double-clicking the Installer. The setup will guide you through the single steps. After you've successfully installed the widget, open it. You should see something similar to the widget in the following image. This Air application works exactly the same way the extension does, providing some extra features. Themes downloaded via the application will be directly added to your Swatch Panel.
Features
You can now browse, search, and save themes directly from your desktop. You can drag individual themes to your desktop, where you can scale them to any size you want, copy swatch values directly from the application or visit the selected theme at kuler.adobe.com to retrieve additional information or comments. I recommend playing with it to get to know the application. It's a really helpful tool to have on your desktop when working with any Adobe Product.
Additional information
Kuler Links
Other websites which provide color themes and palettes
Conclusion
I use Kuler to on my projects and take advantage of it's desktop features. Now that you know how Kuler works, search, save and use the themes you find on Kuler. Also, use them as an inspiration for creating your own and unique color themes. I often create themes which I later don't use. Instead of deleting them, go to Kuler and upload them. In case I’ve missed something, feel free to let me know in the comments so the other readers can learn it too.
Subscribe to the Psd.tuts+ RSS Feed for the best Photoshop tuts and articles on the web.
