Yakaze Tech Studio株式会社（本社：東京都中央区、代表取締役：高井昭彦）は、Web アプリの外観を HTML 属性2つに集約した UI コンポーネントライブラリ 「Pinion UI」 を、MIT ライセンスで無償公開しました。受託開発と自社サービス、両方の現場で磨いてきた UI 基盤の OSS 化で、AI でプロダクトを開発する少人数チームでの利用を主に想定しています。
Pinion UI ― マークアップを変えずに、2属性で858通りの外観
■ 生成されたコードは、単体では正しい。並べると揃わない
「もっと落ち着いた雰囲気に」と AI に頼むと、画面ごとにそれっぽい答えが返ってきます。1枚ずつ見ればどれも正しい。並べると揃わない。余白が、角丸が、同じはずの青が、画面をまたぐと少しずつずれ、直させても次の画面でまた別のずれが出ます。AI は意図をくむことに長けている一方、何十画面にわたって同じ判断を貫くことが構造的に苦手だからです。こうして外観の変更は、「決める」だけの作業のはずが、毎回コストのかかる「実装」になっていました。
■ <html> の2属性で、全画面を一括でスタイルチェンジ
Pinion UI は、そこを <html> の属性2つにまとめました。
<html data-theme="ember" data-tune="brutal">
・data-theme が色 … 39テーマ(各テーマ light / dark 対応)
・data-tune が形 … 余白・角丸・タイプスケール・影の 11チューン
2軸は独立して自由に組み合わせられ、39テーマ × 11チューン × light/dark = 858通りの外観をマークアップ一行変えずに切り替えられます。ボタン・フォーム・テーブルなど 56コンポーネントすべてが同じ2軸に追従するため、属性値を1つ変えた瞬間に全画面が揃います。ずれる余地がそもそもありません。「もう少し柔らかく」も「もっと硬派に」も、指示のし直しではなく属性値の変更になります。
以下の動画は、実際に2属性を打ち替えてアプリ全体の外観が切り替わる様子です。
https://www.youtube.com/watch?v=pXaC8QRUg2s
■ なぜ開発スタジオが、これを無償で公開するのか
当社は、受託開発と自社サービスを両輪とする開発スタジオです。どちらの現場でも、創業者が描いたビジョンが“100%の精度”で世に出ることを当たり前にするため、動く実物を最短1～2週間周期で触りながら育てる開発手法「ビジョン駆動開発(VDD)」を実践しています。事業の方向が変われば見た目も一緒に変わる手法であり、「外観の変更が実装になる」ことが検証サイクルの速度の上限でした。Pinion UI はその上限を外すために社内で育ててきました。
当社の商品は検証サイクルの速さそのものです。UI 基盤は囲い込んでも価値が増えず、多くの環境で使われ鍛えられるほうが、当社にも利用者にも得だと判断しました。
■ 抜けられる設計にした(ロックインなし)
OSS 採用のいちばんの障壁は「あとで抜けられなくなること」です。Pinion UI の出力は独自記法ではなく素の Tailwind CSS クラスで、php artisan ui:eject で依存を外して通常の Tailwind 実装に戻せます。無償公開の信頼は、機能ではなくこの出口で担保しています。
導入は2コマンドです。
composer require sparrowhawk-labs/pinion-ui
php artisan ui:install --ai
--ai を付けると AI エージェント向けの指示ファイルが設置され、AI 自身がアプリに合うテーマを選べます。選ぶのは AI、全画面で外さず実行するのはライブラリという切り分けです。
■ 代表コメント
「AI でプロダクト開発をする小さなチームにこそ、使ってほしいと思っています。
少人数のチームに、デザイナーがいつも横にいるわけではありません。それでも見た目の一貫性は、最初のリリースから問われます。AI は『こういう雰囲気にしたい』という意図までは連れて行ってくれますが、それを何十画面で貫くところで必ず取りこぼしが出る。そこを人の気合いではなく、ライブラリの側で構造的になくしたかった。属性を2つ書けば全画面が揃う。少人数のまま、見た目の質を落とさず前へ進めます。私たち自身が毎日そうやって使っています」
(Yakaze Tech Studio株式会社 代表取締役・高井昭彦)
■ 発信について
英語圏には、Laravel 専門の英語技術メディア「Laravel News」に代表・高井が執筆した解説記事を出稿しました(2026年7月28日公開)。国内へは技術記事と本リリースで発信します。
掲載記事: https://laravel-news.com/pinion-ui-restyle-an-entire-laravel-app-by-changing-two-html-attributes
Laravel News 掲載記事(2026年7月28日公開)
■ 今後の展開
現在の提供は Laravel(Blade)向けですが、色と形の定義は CSS だけで完結しているため、React / Vue などから同じ858通りを使える配布を準備中です。将来的には、UI のさらに上の層を扱うフレームワーク構想「Sparrowhawk」への発展を予定しています。
■ 公開情報
・公式サイト(858通りをその場で試せます): https://pinion-ui.dev
・ソースコード(GitHub): https://github.com/sparrowhawk-labs
・ライセンス: MIT(無償・商用利用可)
■ 会社概要
会社名: Yakaze Tech Studio株式会社
所在地: 〒104-0061 東京都中央区銀座1-12-4 N&E BLD. 7階
設立: 2023年10月27日
代表者: 代表取締役・CTO 高井昭彦
資本金: 300万円
事業内容: Web サービス・モバイルアプリ開発、AI導入・DX支援、バーティカルAI開発支援
公式サイト: https://yakaze.com
主な採択・受賞
・2023年 総務省・角川アスキー「ICTスタートアップリーグ」採択
・2024年 東京都・スタートアップスタジオ協会「TIB STUDIO」採択
・2025年 AWSジャパン「生成AI実用化推進プログラム」モデルカスタマイズコース採択
■ 本件に関するお問い合わせ
Yakaze Tech Studio株式会社 広報担当
Email: [email protected] / TEL: 050-1720-8540(AI自動受付)
企業プレスリリース詳細へ
PRTIMESトップへ
