CSP Web Tools

クリスタ用ブラシ先端画像メーカー

円・四角・粒子・にじみのブラシ先端画像を無料で生成。試し描きストロークで描き味を確かめて、クリスタのブラシ素材として登録できる PNG を書き出します。

ブラシ先端の画像をブラウザ上で作り、その先端を並べた試し描きのストロークで描き味を確かめてから、透過 PNG として書き出します。CLIP STUDIO PAINT のブラシ先端形状の素材として登録して使えます。

基本

このツールでできること

形状・硬さ・不透明度・縦横比・回転・粒子量・にじみを指定すると、透過の先端画像がその場で描かれます。多角形では頂点をドラッグして輪郭を自由に変形できます。同じ先端を並べた試し描きの線も 2 種類生成されるので、先端 1 個の見た目ではなく「線として引いたときの見え方」で設定を決められます。画像は PNG、設定値は JSON で書き出せます。

作画のどの工程で使うか

  • 手持ちのブラシに粒状感やにじみを足したいとき
  • 線として引いたときに粒が繋がるか・縁が荒れないかを、CSP に取り込む前に確かめたいとき
  • 縦横比と回転が付いた平筆や、角のある多角形の先端を作るとき
  • 複数のブラシを揃えるために設定値を JSON で残したいとき

使い方

  1. プリセットから作りたいものに近いものを選びます。
  2. 形状とキャンバスサイズを決めます。キャンバスサイズが書き出す PNG の一辺になります。
  3. 多角形なら頂点数を決め、先端スタンプ上のハンドルをドラッグして輪郭を整えます。「形をリセット」で正多角形に戻せます。
  4. 「描き味」で硬さ・不透明度・縦横比・回転を調整します。
  5. 「粒子・にじみ」で粒子量とにじみを足し、シードで粒の散り方を選びます(「シャッフル」で別の散り方)。
  6. プレビューの 3 枚を見て、線として成立しているかを確認します。
  7. 「先端PNG」で画像を、「JSON」で設定値を書き出します。設定は「マイプリセット」に保存できます。

入力項目の意味

形状
円形・四角形・多角形・粒子・にじみの 5 種類です。粒子は点の集まり、にじみは柔らかい円に薄い点を散らした先端です。
頂点数と自由変形
先端スタンプ上のハンドルをドラッグすると頂点を 1 個ずつ動かせ、正多角形から外れた輪郭も作れます。頂点数(3〜12)を変えると正多角形に戻ります。
キャンバスサイズ
書き出す PNG の一辺(64〜1024px)です。先端はこの 82% で描かれ、周囲は余白です。
硬さ
中心から縁までのぼけ具合です。100% に近いほど輪郭がはっきりします。
縦横比
先端の横と縦の比で、5 種類すべての形状に効きます。1 より大きいと横長になり、回転と合わせると平筆になります。
シード
粒の散らばりを決める番号(0〜999999)です。同じシードなら同じ散り方で、変えても形や濃さは変わりません。
粒子量 / にじみ
粒子形状では粒子量が粒の数そのもの、他の形状では粒子量 × ノイズの割合の数だけ点が散ります。結果は上部の「実効粒子数」に出ます。

結果の読み方と CLIP STUDIO PAINT への持ち込み方

プレビュー 3 枚の見分け方

  • 先端スタンプ: 書き出す PNG そのものです。市松模様が透明部分で、多角形では頂点のハンドルが重なります。縁のぼけ幅と粒の密度はここで決めます。
  • 等速ストローク: 筆圧を変えずに引いた線です。スタンプが繋がらず数珠状に見えるなら、硬さを下げるか先端を大きくします。
  • 筆圧 弱→強→弱: 入りから抜きまでを 1 本で見ます。抜きが唐突に切れるなら、硬さか不透明度が強すぎます。
  • スタンプの間隔は CSP の[ストローク]→[間隔]で決める項目なので、このツールでは扱いません。プレビューは形状ごとの代表的な間隔で描いています。

手順 1: 画像素材として登録する

  1. 「先端PNG」で書き出した画像を CLIP STUDIO PAINT で開きます。
  2. [編集]メニュー→[素材登録]→[画像]を選びます。
  3. [素材のプロパティ]ダイアログで[素材名]を入力し、[ブラシ用素材設定]の[ブラシ先端形状として使用]にチェックを入れます。ここを入れ忘れると、先端形状の一覧に出てきません。
  4. [素材保存先]で保存するフォルダーを選び、必要なら[検索用タグ]を付けて[OK]を押します。
[素材のプロパティ]ダイアログ。左上に[素材名]の入力欄、その下に[素材のイメージ]のプレビュー、さらに下の[ブラシ用素材設定]に[用紙テクスチャとして使用]と[ブラシ先端形状として使用]のチェックボックスが並ぶ。右半分は[貼り付け動作]の[拡大縮小][タイリング][タイリング方向]と[重ね合わせの指定]。
手順 3 の[素材のプロパティ]ダイアログ。図では[ブラシ用素材設定]のチェックが 2 つとも外れています。この状態で登録すると先端形状の一覧に出てこないので、[ブラシ先端形状として使用]を必ず入れてください。画面: CLIP STUDIO PAINT 5.0.4(株式会社セルシス)

手順 2: ブラシの先端形状に割り当てる

  1. 元にしたいブラシを選び、[ツールグループ]パレットのメニュー→[ツールの複製]で複製します。設定を上書きしても元のブラシが残ります。
  2. 複製したブラシを選んだまま[ツール詳細]パレット(Ver.5.0 で[サブツール詳細]パレットから改称)を開き、[ブラシ先端]カテゴリを表示します。
  3. [先端形状]を[円形]から[素材]に切り替えます。
  4. 「ここをクリックして先端形状を追加してください」をクリックし、[ブラシ先端形状の選択]ダイアログで登録した素材を選んで[OK]を押します。
  5. 描き味が決まったら[ツール詳細]パレットの[全設定を初期設定に登録]で、その状態をブラシの初期値にします。
ペンツール選択時の[ツール詳細]パレットで[ブラシ先端]カテゴリを開いた状態。[先端形状]の[円形]と[素材]の切り替え、登録済み先端画像のサムネイル、[硬さ]、[厚さ]150、[適用方向]、[向き]、[左右反転]、[上下反転]、[ブラシ濃度]が縦に並んでいる。
手順 2〜4 で使う[ツール詳細]パレットの[ブラシ先端]カテゴリ。[先端形状]が[素材]に切り替わると、その下にサムネイルと[厚さ][向き]などが並びます。画面: CLIP STUDIO PAINT 5.0.4(株式会社セルシス)

登録したあとに CSP 側で決める設定

[ブラシ先端]→[厚さ][適用方向][向き]
[厚さ]で先端を潰し、[適用方向]で潰す軸を[水平][垂直]から選び、[向き]で 0〜360 度回します。縦横比と回転はこのツールで PNG に焼き込めるので、常に使う比率だけ焼き込み、ブラシごとに変えたいぶんはここで振ります。
[ブラシ先端]→[硬さ]
公式マニュアルに「[先端形状]で[円形]を選択している場合に設定できます」とあるとおり、素材の先端では使えません。ぼけ具合はこのツールで作り込んでおきます。
[ブラシ先端]→[ブラシ濃度]
選択中のブラシ先端形状 1 つあたりの不透明度です。このツールの不透明度と掛け算になるので、薄い先端を作ったときは CSP 側を 100 のままにしておくと見当が付けやすくなります。
[ストローク]→[間隔]
[固定][広い][普通][狭い]から選び、数値のスライダーが出るのは[固定]のときだけです。公式マニュアルには「間隔がせまくなるほど、滑らかな線を描画できますが、ストロークが重くなります」とあります。等速ストロークのプレビューが数珠状なら、ここを狭める判断ができます。

複数の先端を 1 本のブラシに入れる

「バリエーション書き出し」で作ったシード違いの PNG は、1 枚ずつ素材登録したうえで同じブラシにまとめて追加できます。[ブラシ先端]で「ここをクリックして先端形状を追加してください」を繰り返すと先端が並び、ドラッグ&ドロップで順序を入れ替えられます。並んだ先端をどの順で出すかは[ストローク]→[繰り返し方法]で決め、[繰り返し][折り返し][繰り返さない][ランダム][一巡のみ][ランダムに一巡]から選びます。粒の並びが規則的に見えるのを避けたいときは[ランダム]にします。

仕組みと制約

処理の根拠

先端は canvas に描いた図形で、ストロークも同じ先端を経路上に並べたものです。試し描き専用の描画コードは無く、プレビューの粒立ちは書き出す PNG と同じです。円形の縁は硬さの位置から外周へ向けて透明になる放射グラデーション、四角形と多角形は (1 − 硬さ) × 10px 相当のぼかしで作ります。多角形の頂点は外接ボックスに対する比(右端が 1)で持つため、キャンバスサイズや縦横比を変えても形が保たれます。縦横比はどの形状でも幅と高さに分けて掛かります。ストロークプレビューのスタンプ間隔は形状ごとの内部値で、外接直径の長辺 × その % ごとに 1 個打っています。粒子とにじみの散らばりはシードとスタンプ番号だけから作った擬似乱数で決まり、硬さや粒子量を変えても並びは変わりません。

精度と対象外のこと

このツールが作るのは先端画像と、その並べ方の見本で、CSP のブラシエンジンの再現ではありません。

  • 筆圧カーブ・手ブレ補正・入り抜きは CSP 側の設定です。プレビューの筆圧は 0 から最大へ上がって 0 へ戻る山型に固定しています。
  • 傾き検知、進行方向への追従、ランダム回転、散布などのブラシ設定は再現していません。
  • 色混ぜ・下地混色・水彩境界など、下のレイヤーと影響し合う効果は含みません。
  • 書き出す JSON はこのツールの設定の記録で、CSP のサブツールファイルではありません。読み込み機能もありません。

画像・入力データの扱い

先端画像の生成も試し描きもすべてブラウザ内で完結し、作った画像や設定を外部に送信することはありません。設定とマイプリセットはブラウザの localStorage に入り、次に開いたときに復元されます。別の端末には引き継がれないので、残したい設定は JSON でも書き出してください。

よくある質問

スタンプの間隔はどこで設定しますか?

CSP 側の[ストローク]→[間隔]です。[固定][広い][普通][狭い]から選ぶ方式で、写せる数値がある項目ではないため、このツールには間隔の入力欄を置いていません。プレビューは形状ごとの代表的な間隔で描いているので、粒の繋がり方の目安として見てください。

多角形の形はどこまで崩せますか?

頂点は外接円の 1.2 倍まで引き出せます(それ以上は PNG からはみ出すため)。崩すのは頂点数を決めてからにしてください。ハンドルは矢印キーでも動かせ、Home でその頂点だけ戻せます。

キャンバスサイズは大きいほうがよいですか?

大きい先端を縮小すると縁が滑らかになりますが、処理は重くなります。線画用は 256px 前後、大きなテクスチャブラシは 512〜1024px が目安です。

同じ設定でもう一度作れば同じ画像になりますか?

なります。粒子とにじみの位置はシード由来の擬似乱数で、多角形の頂点座標も JSON に残るので、設定を入れ直せば同じ先端になります。

バリエーション書き出しは何をしますか?

今の設定のままシードだけを変えた先端 PNG を 2〜16 枚まとめて保存します。ファイル名のシード番号を入力欄に戻せば、その散り方を使えます。

CLIP STUDIO PAINT の入手について

CLIP STUDIO PAINT とはどんなソフトか

CLIP STUDIO PAINT(クリップスタジオペイント)は、株式会社セルシスが開発しているイラスト・マンガ・アニメーション制作用のペイントソフトです。汎用の画像編集ソフトとの違いは、ペン入れに向いた筆圧設定、コマ割りとフキダシ、トーン、3D 素材、パース定規といった、紙と印刷を前提にした制作機能が最初から入っている点にあります。Windows・macOS・iPad・iPhone・Android・Chromebook で動きます。

体験版と購入の選択肢

  • 公式サイトで無料の体験版が配布されています。描き味と必要な機能を自分の環境で確かめてから判断できます。
  • グレードは PRO と EX の 2 つで、複数ページのマンガ原稿を 1 つの作品としてまとめて扱う機能が要るかどうかが主な分かれ目です。
  • 買い方は買い切りの一括払いと、月額・年額のプランがあります。使える端末の種類と台数はプランによって変わります。
  • 価格・プランの構成・対応端末は改定されることがあるため、最新の条件は公式サイトで確認してください。

このツールと CLIP STUDIO PAINT の関係

このページのツールはブラウザだけで動くので、CLIP STUDIO PAINT を持っていなくても計算や書き出しはそのまま使えます。ただしここで得られるのは CLIP STUDIO PAINT へ持ち込むための材料で、書き出した先端 PNG は、CLIP STUDIO PAINT にブラシ先端形状の素材として登録して初めてブラシになります。考え方の部分は他のペイントソフトにも流用できますが、数値と書き出しは CLIP STUDIO PAINT に合わせて作ってあります。