IT tutorials
 
Graphics
 

Adobe Flash Catalyst CS5 : Changing stroke and fill (part 1) - Change the fill color

1/30/2012 6:24:09 PM
- How To Install Windows Server 2012 On VirtualBox
- How To Bypass Torrent Connection Blocking By Your ISP
- How To Install Actual Facebook App On Kindle Fire
If drawing basic shapes is like making a coloring book, then changing fill and stroke is the fun part. You get to color in the pictures. Flash Catalyst lets you choose between no fill (transparent), solid fill, and gradients that fade between one or more colors at various angles. Even the stroke (outline) can be a gradient if it has enough weight. Weight refers to the width or thickness of the stroke. All of these changes are made in the Common section of the Properties panel.

Change the fill color

When you first start Flash Catalyst, new shapes are created with a solid white fill. But as soon as you change the fill color of a shape, any new shape that you draw takes on the most recent fill color that you’ve applied.

1.
Using the Select tool (dark arrow), click the Panel Background rectangle (the largest rectangle) to select it.

The properties for the selected shape appear in the Properties panel. The fill color is solid white.

2.
Select the Panel Header rectangle.

3.
In the Properties panel, click the Fill color swatch to open the Color Picker.

In the Color Picker, you can select a color in the palette or enter a hexadecimal color value. For additional colors, drag the slider (right-pointing arrow) up or down to select a new color range and then drag in the color field to select a new color. You can also sample a color in the application by using the Eyedropper tool.

4.
In the color palette, select blue #2B4381.

5.
Select the Header Overlay and Thumb rectangles.

Tip

Shift-click to select multiple objects in the artboard, or contiguous rows in the Layers panel. But Ctrl/Command-click to select noncontiguous rows in the Layers panel.

With Header Overlay and Thumb selected, you can apply the same properties to both shapes at the same time.

6.
In the Properties panel, click the Fill color swatch to open the Color Picker, and select the Eyedropper tool.

7.
With the Eyedropper tool selected, move the pointer over the blue Panel Header rectangle and click to sample its color.

The Color Picker disappears and the blue color you sampled is applied to the Header Overlay and Thumb shapes.

8.
Select the Track rectangle and the Ellipse.

9.
In the Properties panel, click the Fill color swatch and select light gray #CCCCCC.

The scroll bar track and the Ellipse are light gray.

Understanding hexadecimal color values

The colors you see on your computer monitor are produced using various combinations of red, green, and blue (RGB). You may have noticed the numbers in the Color Picker. These are referred to as hexadecimal color codes. Hexadecimal color codes define the amounts of red, green, and blue used to create a color. The levels of red, green, and blue are measured using a numbering system that runs from 0 to 255. For example, the color black is created by mixing 0 red, 0 green, and 0 blue. White is represented by 255 red, 255 green, and 255 blue. Yellow is 255 each of red and green, and 0 blue.

While RGB color values are based on the decimal system (base 10), hexadecimal color values are represented by a hexadecimal numbering system (base 16).

In the decimal system, when you write 43 it means 4 tens and 3 ones. When you write 43 in hexadecimal it means 4 sixteens and 3 ones. 43 in hexadecimal is (4x16) + 3 = 67.

In hexadecimal, A = 10, B = 11, C = 12, and so on to F, which is 15. The highest possible two-digit number in hexadecimal is FF. It means 15 sixteens and 15 ones, which is 255 (the most amount of any color).

Hexadecimal color codes always consist of a number sign (#) followed by a combination of six characters.

  • The first two digits determine how much red is in the color.

  • The middle two digits determine how much green is in the color.

  • The last two digits determine how much blue is in the color.

  • The code for black is #000000.

Colors containing RGB values of FF contain the most amount of a color (255 or 100%). For example, the hexadecimal value for white is #FFFFFF, which means it contains the most amount of red, green and blue.

When specifying colors in a web application, you can use hexadecimal values instead of RGB values. An advantage of using hexadecimal codes to choose colors is that you can limit your design’s color palette to colors that are considered safe for viewing on the web. Web-safe colors consist of any three of the pairs 00, 33, 66, 99, CC, or FF in the hexadecimal range. For example, #FF9900 is a web-safe color, whereas #39C6C5 does not appear in the web-safe color palette.

The importance of these safe colors has been reduced dramatically over the years as display monitors have become more capable of displaying many colors.

 
Others
 
- Adobe Illustrator CS5 : Working with Layers - Showing and Hiding Layers and Objects, Merging Layers and Groups
- Adobe Illustrator CS5 : Working with Layers - Duplicating Layers and Objects, Locking Layers and Objects
- Dreamweaver CS5 : Editing Content in the Browser (part 2) - Registering an InContext Editing site & Making edits online
- Dreamweaver CS5 : Editing Content in the Browser (part 1) - Setting up InContext Editing templates
- Dreamweaver CS5 : Using Dreamweaver Templates - Updating Templates & Removing Template Markup
- Adobe Photoshop CS5 : Fixing Problems Caused by Your Camera’s Lens
- Adobe Photoshop CS5 : Removing Tourists the Easy Way
- Adobe After Effects CS5 : Adding transparency & Rendering the composition
- Adobe After Effects CS5 : Applying an animation preset
- Adobe Fireworks CS5 : Batch-processing images
 
 
Top 10
 
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
programming4us programming4us
 
Popular tags
 
Video Tutorail Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 Adobe Indesign Adobe Flash Professional Dreamweaver Adobe Illustrator Adobe After Effects Adobe Photoshop Adobe Fireworks Adobe Flash Catalyst Corel Painter X CorelDRAW X5 CorelDraw 10 QuarkXPress 8 windows Phone 7 windows Phone 8 BlackBerry Android Ipad Iphone iOS
Celebrity Style, Fashion Trends, Beauty and Makeup Tips.