要素の塗りつぶしやストロークの色は、次の複数の手段で変更できます。
- カラーパネル
- プロパティ パネル
- ツールバーのストローク ツールと塗りつぶしツール
- ツールバーのカラーチップ
アクティブな色
塗りつぶしやストロークのアクティブな色は、左側のツールバーの下部にあるカラーチップに表示されます。ストロークの色（およびボーダーの色）は白抜きのチップで表示されます。
以下の例では、カラーチップはデフォルトの色（白の塗りつぶしと黒のストローク）に設定されています。
次のツールを使用すると、アクティブな色が適用されます。
- 要素ツール
- ペンツールとシェイプツール
- ストローク ツールと塗りつぶしツール
単一の要素を選択した場合、アクティブな色には、その要素の塗りつぶしの色とストロークの色が反映されます。
ツールバーのカラーチップの上にあるボタンを使用すると、アクティブな色をすばやく変更できます。
- デフォルトの色
- アクティブな色をデフォルトの色（白の塗りつぶしと黒のストローク）にリセットします。
- 塗りつぶしとストロークを入れ替え
- 塗りつぶしとストロークの色を切り替えます（または、X キーを押します）。
- アクティブな色をデフォルトの色（白の塗りつぶしと黒のストローク）にリセットします。カラーミキサー
カラーミキサーを使用すると、[カラー] パネルで常に使用できる色をビジュアル ダイアログで選択できます。また、ツールバーか色ベースのプロパティのフィールドでカラーチップをクリックしたときにも、カラーミキサーがポップアップ表示されます。
カラーミキサーで色を選択するには:
- カラー スライダーを使用して、色相を選択します。
- カラー フィールドの内側をクリックして、適切なシェードを選択します。
- アルファ スライダーを使用して色の透明度を変更します。
色の値とアルファ値を入力するには、カラーミキサー ダイアログのテキスト フィールドを使用します。
- # - 26C6DA などの色の 16 進数を入力します。
- %（またはカラーパネルで A）- アルファ値（透明度）を入力します。0 が完全な透明、100 が完全な不透明です。
- RGB（カラーパネルのみ）- 色の RGB 値（赤、緑、青）を入力します。
その他のオプションはカラーミキサーで利用でき、選択されている部分が黄色でハイライト表示されます。
- 色指定なし
- ストロークや塗りつぶしの色を取り消します。
- 単色
- 単色を選択します。
- 線形グラデーション
- 線形グラデーションを作成します。
- 円形グラデーション
- 円形グラデーションを作成します。
- 見本
- 色見本パレットに切り替えます。
- ストロークや塗りつぶしの色を取り消します。
- 単色を選択します。
- 
- 
- スポイトツール
スポイトツールを使用すると、ステージ上で既存の色を選択できます。
使用するには、ツールバーからスポイトツール を選択するか、I キーを押します。また、カラーミキサーを開いて、要素の塗りつぶしの色やストロークの色などを選択すると、自動的に有効になります（スポイトツールは、テキストツールの色の設定には使用できません）。
Google Web Designer のツールバー、パネル、タイムライン、メニューでスポイトツールを使用することはできません。インターフェースのいずれかの部分をクリックするか Esc キーを押すと、自動で有効になったスポイトツールが無効になります。
スポイトツールではアルファ値（透明度）は考慮されません。たとえば、背景が白で要素が半透明の赤であることからピンク色で表示されている場合、その要素にスポイトツールを使用すると不透明度 100% のピンクが選択されます。
要素の色の設定
ページの背景色を変更するには、要素が選択されていない状態で、[プロパティ] パネルの [塗りつぶし] フィールドを使用します。
カラーパネルを使って色を指定するには:
- 色を指定する要素をクリックします。
- [カラー] パネルの上部にある [塗りつぶし] または [ボーダー] をクリックします。
- カラーミキサーまたは色見本パレットから色を選択します。
プロパティ パネルを使用して色を指定するには:
- 色を指定する要素をクリックします。
- [プロパティ] パネルの [スタイル] セクションで、塗りつぶしの色フィールドまたはボーダーの色フィールドのいずれかにある色見本をクリックすると、カラーミキサーが開きます。
- カラーミキサー、色見本パレット、またはスポイトツールのあるステージで、色を選択します。
塗りつぶしツールを使用するには:
- ツールバーから塗りつぶしツール
を選択するか、F キーを押します（ツールバーにストローク ツール
やグラデーション ツール
が表示されている場合は、ボタンを長押しし、ポップアップ メニューから塗りつぶしツールを選択します）。
- ツールバーのカラーチップをクリックするか、[カラー] パネルを使用して色を選択します。
- 色を設定する要素にカーソルを合わせると、要素の周りに緑色の枠線が表示されます。
- 要素をクリックします。
ストローク ツールを使用するには:
- ツールバーで塗りつぶしツール
- ストロークをカスタマイズします。
- ツールバーのカラーチップをクリックして、ストロークやボーダーの色を選択します。
- ツール オプション バーで、[ボーダー]（ほとんどの要素の場合）または [ストローク]（線と楕円の場合）の幅を指定します。
- ボーダーの場合は、ツール オプション バーの [スタイル] プルダウンからボーダー スタイルを選択します。
- 変更する要素のボーダーにカーソルを合わせると、要素の周りに緑色の枠線が表示されます。
- 要素をクリックします。
色見本パレット
色見本パレットにはデフォルトで複数の色が含まれており、色やグラデーションを保存してドキュメント内で簡単に再利用できます。画像内の色に基づいて見本を作成することもできます。詳細については、色見本の使用をご覧ください。
グラデーション
グラデーションとは、色を少しずつ変えて塗りつぶす手法です。グラデーションの使用をご覧ください。