グラデーション生成ツール「GradientGenerator」の紹介
グラデーション生成ツール「GradientGenerator」は、CSSグラデーションの作成を支援するツールです。このツールは4つの主要な部分で構成されています。
グラデーションリスト:左側にはレイヤーリストがあります。リスト内に少なくとも1つのレイヤーがある場合、ボタンをクリックすることで最終的なコードをダウンロードできます。このパネルでは、レイヤーの順序を管理し、削除し、表示のオン/オフを切り替えることができます。特定のレイヤーが非表示に設定されている場合、最終的なコード生成には考慮されません。
レイヤー設定パネル:レイヤーパネルで特定のレイヤーをクリックすると、画面下部に設定パネルが表示されます。このパネルの左上隅には、グラデーションのタイプを設定するボタンがあります。そのすぐ隣には、サイズ、繰り返し、全体的な透明度、ブレンドモードなどのグラデーションの設定パネルを開くボタンがあります。入力値は、タイピング、マウスホイール、またはフィールドをクリックしてカーソルを上下にドラッグすることで変更できます。このパネルのタイトルのすぐ隣にはアイコンがあり、クリックするとメニューが表示され、特定のレイヤーの設定を他のレイヤーに適用することができます。パネルの上部エッジをつかんで全体を移動できます。その隣には、スライダーに自動的にポイントを追加するパネルを開くボタンがあります。パネルの主要部分はグラデーションスライダーで占められています。スライダーの特定のポイントをダブルクリックすると、新しいポイントが追加されます。マウスまたは矢印キーでポイントを移動できます。Ctrlキーを使用して複数のポイントを選択できます。スライダーの右上にはいくつかのボタンがあります。これらのボタンを使用して、スライダー上の次/前のポイントを選択できます。また、選択したポイントのグラデーションをカットできます。これは、選択したポイントの滑らかな遷移を無効にしたい場合に便利です。
メインボード:左側のパネルからレイヤーを選択すると、メインボード上でその焦点、グラデーションの方向、およびグラデーションの位置を設定できます。これらのオプションは、与えられたグラデーションのタイプとそのサイズに応じて利用できます。与えられたオプションはメインボードの下部に表示されます。ボードの下部に表示されるキー(Q、W、E)を使用して他のモードに切り替えることができます。また、マウスキーを使用してこれらのモードを切り替えることもできます。デフォルトでは、左キーはグラデーションの中心点を移動するために使用され、右キーはグラデーションを回転させるために使用されます。さらに、Sキーを使用してグリッドとスナップモードを有効/無効にできます。
ライブラリ:ライブラリは保存された作品を保管するために使用されます。アイコンをクリックすると表示できます。少なくとも1つのレイヤーを作品に追加すると、現在の作品全体をライブラリに保存できます。ライブラリのリスト内のアイテムをクリックすると、現在の作品にそのレイヤーが追加されます。ライブラリの右上隅にはメニューアイコンがあり、このメニューではいくつかのオプションがあります。最初のオプション「ライブラリを管理する」を有効にすると、新しいグループを追加し、既存のグループを名前変更し、またはグループ間でアイテムをドラッグできます。インポートとエクスポートは、ファイルから選択した要素をインポートし、ファイルにエクスポートできます。このメニューの最後のオプションは、オンラインライブラリを開くことができます。このパネルから他のユーザーが作成した要素を追加できます。自分の作品を共有したい場合は、オンラインライブラリパネルの上部のテキスト内のリンクをクリックして追加のフォームを開くことができます。