ログイン

エージェントがあなたの隣で、ひとつのボードにデザインします。画面も、サイトも、ブランドも、いっしょに。

Mac版をダウンロードデザインを始める
ボード上で Claude がストリーミングアプリ Lumen をデザインしている Kite のエディタ

自分のエージェントを連れてこよう。 Claude、Cursor、ChatGPT、あらゆる MCP クライアントに。コピーするキーは不要です。

エージェントのデザインの仕方に合わせてつくりました。 描く前に読まれるデザインシステム、コメントでの依頼、本物のエディタ、そしていつものツール。

  • Billing

    LayersAssets

    Pages

    Components

    Screens

    Layers

    Components

    Balance

    Type

    Sidebar

    Choice

    Palette

    Form

    Overview

    Checkout

    Components

    Balance

    $1,200.35

    Payment$30.32

    DueAug 9th

    Pay
    Aa123#&!RegularMediumHeavy
    CompanyCalifornia
    638 × 400

    ひとつのデザイン、どんなシステムにもエージェントは固定値ではなくシステムの変数で描きます。システムを切り替えても、値をひとつ変えても、それで描いたフレームはすべて追従します。

  • あなたのデザインシステム。 描く前に、毎回読まれます。 色・文字・余白は変数に、パーツはコンポーネントに、ルールはやさしい言葉のスキルに。エージェントは描く前にすべて読むので、仕上がりは誰にでもある見た目ではなく、あなたらしくなります。

    デザインシステム
  • コンポーネントは描き直さず、配置するパーツはバリアントごと一度だけつくります。エージェントは新しいカードを描く代わりに、それに追従するコピーを置きます。
  • ライトとダークを、ひとつのセットで変数はモードごとに値を持ちます。フレームをダークに切り替えれば、その変数で描いた色がすべて追従します。
  • スキルは、やさしい言葉でブランドの見た目、守るべきルール、投稿のつくり方。エージェントは仕事に合ったスキルに従います。
  • すべてのファイルに、ひとつのライブラリファイルのコンポーネントをワークスペースに公開。どのファイルのコピーも、更新すれば追従します。

  • Around · Checkout

    Balance

    $1,200.35

    Payment$30.32

    DueAug 9th

    Pay
    $500.00Remaining balanceRecommended$250.00Half now, half next monthContinue
    Claude

    @Claude make this a checkout: a Pay button under the balance, a Continue under the options, both in the system's primary

    Run with Claude Code when sent

    Loukmannow

    @Claude make this a checkout: a Pay button under the balance, a Continue under the options, both in the system's primary

    Claude is working…Done by Claude

    Claudenow

    Done: Pay under the dues and Continue under the options, both the system's primary at its radius, 32 high, full width.

    コメントで頼めば、仕上がるフレームでエージェントをメンションして送信。Kite for Mac なら Claude Code や Codex ですぐに作業を始め、スレッドで返信します。

  • コメントを残すだけ。 エージェントが仕上げます。 変更したい場所にコメントを置いて、エージェントをメンション。クリックしたフレームとレイヤーを読み、作業して、スレッドで返信します。

    コメント

  • do my Kite requests

    3 requests waiting, oldest first.

    • Make the balance a checkout
    • A phone version of this screen
    • Try a warmer hero photo

    Done, each answered in its thread.

    Kite の依頼をこなしてブラウザでは、依頼はコメントで待機します。エージェントにこう伝えれば、ひとつずつ片づけます。

  • $500.00Remaining balanceRecommended$250.00Half now, half next monthContinue
    ChoiceFirst one on, with the chip.
    Button under it?

    ボード上のメモ付箋や注釈を作業のすぐ隣に。エージェントはそれを読み、自分のメモも残します。

  • Around

    LayersAssets

    Pages

    App

    Website

    Layers

    Covers

    Speakeasy bars

    Best rooftop bars

    Tasting menus

    Profile

    Guide

    Covers

    308 × 144

    Profile

    Loukman Nacik@loukman · 3 guidesFollow
    100%Share
    CoversStack

    Frame

    W308H144

    Flex

    →↓▦LoukmanGap12Loukman↔16↕16

    Fill

    colour/page

    Radius

    ◜18

    Effects

    Drop shadow

    すべての値を、ピクセル単位で余白やパディング、サイズをドラッグすると、フレームが場所を空けながら動きます。エージェントも同じ項目を設定するので、仕上がりはあなたと同じくらい正確です。

  • 本物のデザインツール。 プロンプト入力欄ではありません。 Flex とグリッド、コンポーネント、変数、ペン、本格的なタイポグラフィ。Figma でいつも使うものはすべてここにあります。しかもデザインは本物の HTML と CSS なので、エージェントが書くものとあなたが描くものは同じです。

    エディタ
  • Flex、グリッド、制約行・列・グリッドを、そろった余白とパディングで。ひとつ変えれば、ほかが場所を空けます。
  • ペン、鉛筆、図形パスを点ごとに、またはフリーハンドで描いて、結合・平坦化・アウトライン化できます。
  • 文字、塗り、エフェクトフォントとウェイトを単語ごとにスタイリング。グラデーション、画像の塗り、影、ぼかし。
  • プレビューと履歴フレームを実際の画面として確認。バージョンを保存して、いつでも戻れます。

シェーダーも、ファイルの中に。 エディタ自身のエンジンがリアルタイムに描く背景とフィルター。粒子もガラスも独自のものです。ドラッグしてみてください。Kite ではどのフレームにも適用できます。

塗りとエフェクト
DuskFlow
NorthernAurora
SunsetBands
DawnMist
RisoMarble
Ink in waterSmoke
RibbonThreads
CandyCells

  • いまあるものと、そのまま使える。 Figma、Mac、そして Chrome。 Figma のファイルを取り込み、フレームを送り返す。Kite を専用アプリで使えば、コメントの依頼が Mac 上で動きます。Chrome でどんなウェブページもコピーして、レイヤーとして貼り付けられます。

    Figma 連携

  • Import from Figma

    figma.com/design/Around-AppImport

    • Create component
    • Copy
    • Copy/Paste as
    • Copy as PNG
    • Copy for agent
    • Copy to Figma
    • Copy as Tailwind

    Figma と、行き来できるFigma からフレームを貼り付けるか、リンクからファイルを丸ごと読み込み。フレームを右クリックして Copy to Figma を選べば、Figma にレイヤーとして貼り付きます。

  • Claude finished your Kite requestnowIt answered on the comment.

    Kite for Macファイルごとのタブ、エージェントが作業中のタブにつく印、Mac 上の Claude Code や Codex で動く依頼。終わったらお知らせします。

  • Frame 1000 × 372 · 9 layersEvery city,
    the places worth going.    Guides from people who've been.DownloadBrowse guides
    Select a sectionClick copy ⇧ Click several

    Chrome 用 Kite Captureウェブページやその一部を指してクリック。Kite に貼り付ければ、編集できるフレーム・テキスト・画像として入ります。

ひとつのボードに、すべてのカーソル

たくさんの手でつくる。

チームとエージェントが、それぞれのカーソルで、同じファイルに同時に。 誰かが描いたものはその場でみんなに見え、変更はすべて、引き継いで続けられるレイヤーです。

細かいところも、最初から。 フォントからバージョン履歴まで、デザインツールに必要なものはひと通りそろっているので、ほかのアプリに戻る必要はありません。

ドキュメント
  • エージェントはどこからでも接続リモート MCP サーバー。Claude、ChatGPT、Cursor が、どこで動いていてもワンクリックで接続できます。コピーするキーは不要です。
  • K キーで拡大縮小フレームのサイズを変えると、中身もいっしょに拡大縮小します。文字、線、角、影まで。1440 から 720 へ、ひと操作で。
  • 本物の CSS grid列と行と余白を、ブラウザが CSS grid としてレイアウト。コードと同じやり方です。
  • コンポーネントのプロパティバリアント、オンオフの切り替え、テキスト、差し替えを、どのコンポーネントでも各コピーから設定できます。
  • フォルダの中にフォルダ何階層でも。ワークスペース全体で共有でき、スターをつけたファイルはサイドバーに並びます。
  • ファイルの中まで検索⌘K でファイル名はもちろん、中の文字やレイヤー名でも見つかります。
  • リアルタイムで、いっしょにチームとエージェントが同じファイルに同時に。それぞれ自分のカーソルを持っています。
  • リンクひとつ、ルールはあなたがリンクを知っている全員にも、招待した人だけにも。閲覧のみの人もコメントできます。
  • すべてのフォントGoogle Fonts、チームがアップロードしたフォント、パソコンのフォント。
  • コードとしてコピーどのフレームも HTML、React、Tailwind として。実際に使っている値のまま。
  • なんでも書き出しPNG、WebP、SVG、PDF を必要なサイズで。ファイル丸ごとなら .kite で。
  • プレビューフレームを単体で、実際の画面やページとして。次のフレームもワンクリックで。
  • バージョン履歴バージョンを保存し、ファイルのこれまでをすべてたどって、好きな時点に戻せます。
  • いまの作業を持ち込むFigma のファイル丸ごと、ウェブページのどこでも、.kite ファイルも。編集できるレイヤーとして貼り付けられます。
  • コメントを見逃さないコメント、メンション、招待を、Activity、メール、Mac で。

よくある質問。 始める前によく聞かれること。

Kite とは？

Kite は、エージェントとチームが同じキャンバスでデザインする AIデザインツールです。Claude、ChatGPT、Cursor、あらゆる MCP クライアントが、あなたの見ている前でファイルに描き、デザインシステムに従い、コメントの依頼をこなします。

Kite は Figma の代替になりますか？

はい。Kite には Figma でいつも使うものがあります。オートレイアウト、バリアント付きコンポーネント、モード付き変数、ペン、本格的なタイポグラフィ。Figma との間でコピー＆ペーストでき、Figma のファイルを丸ごと読み込めます。しかもデザインは本物の HTML と CSS なので、エージェントが直接デザインできます。

Claude は Kite でデザインできますか？

はい。Claude のコネクタディレクトリからワンクリックで Kite を追加するか、コマンドひとつで Claude Code を接続します。Claude はファイルをつくり、あなたの目の前で描き、チームのコメントに返信します。ChatGPT、Cursor、Codex などのエージェントも同じように接続できます。

Kite に MCP サーバーはありますか？

はい。Kite のホスト型 MCP サーバーは、Streamable HTTP と OAuth に対応したすべてのクライアントで使え、デザインを読む・描く・編集する・確認するための 59 のツールがあります。Kite for Mac には、お使いのマシン上のエージェント向けにローカルサーバーもあります。

Kite の料金は？

Kite は無料で始められ、編集者と閲覧者は無制限、ファイルは 3 つまで。Pro は編集者 1 人あたり月額 $20、年払いなら月 $16 です。AI クレジットはありません。エージェントは、いま払っているプランで動きます。

あなたとエージェントが、ひとつのボードで。

ブラウザでも、Kite for Mac でも。いま使っているエージェントを、いま払っているプランのまま連れてきてください。

Mac版をダウンロードデザインを始める