2,480
+12.6%
ユニバーサル CSS インフラストラクチャ
すべてのインターフェイスに既製の回答
Gardener は、基本的な CSS、インタラクティブ コンポーネント、ビジネス レシピ、デスクトップ アダプテーション、および機械可読マニフェストを 1 つのシステムに統合します。人が直接開発することができ、毎回スタイルを再編成することなく、AI が正確に選択して使用することができます。
- ランタイム依存関係なし
- 白い背景にニュートラルなデフォルト
- 小さな角丸システム
- Web とデスクトップの共有
94%
エンタープライズ サイトの組み立て
42カラーテーマ
506レジスタコンポーネント
11,498ツール
52機械可読ページレシピ
ボタン 1 つからスーパー CMS へ
基本的なアトム、共通コンポーネント、高密度バックエンド、モバイル端末、コンテンツの商用化、AI ワークスペース、デスクトップ WebView をカバーします。デフォルトも十分に抑えられており、組み合わせの幅も十分に広い。
完全なベースレイヤー
リセット、トークン、24 / 12 グリッド、タイポグラフィ、間隔、サイズ、論理方向、色、境界線、シャドウ、ステータス、および 5 レベルの応答性の高いツール クラス。
すぐに提供できるコンポーネント
フォーム、ナビゲーション、オーバーレイ、データ、メディア、ビジネス、コミュニケーション、法律、ワークフロー、ダッシュボードはすべて、安定した構造と状態規約を持っています。
AI ネイティブ インタラクション
メッセージ フロー、思考プロセス、ツールの呼び出し、承認、エージェントのステータス、スケジュール、参照、アーティファクト、モデルの選択、およびマルチモーダル生成。
複雑なビジネスレシピ
ログイン、モバイル カテゴリ、CMS エディタ、メディア ライブラリ、受信トレイ、ファイル管理、フォーム構築、ストアの掲載情報、請求、およびエンタープライズ設定。
デスクトップ アプリケーションの適応
Tauri と Electron は、タイトル バー、ウィンドウ コントロール、アクティビティ バー、編集領域、インスペクター、列、ステータス バーを共有し、ブリッジ インターフェイスは安全なままです。
環境マトリックスが完了しました
ライト、ダーク、システム、ハイコントラスト、RTL、モーション軽減、強制カラー、印刷、モバイル、タブレット、デスクトップ。
公式 Vue 3 バインディング · 1.0.0 安定版
CSS の全機能が Vue API になりました
@gardener/vue 506 のコンポーネントと 66 の DOM 動作の完全なマッピング。プラグイン、タイプセーフ コンポーネント、ディレクティブ、コンポーザブル、10 軸テーマ プロバイダー、v モデル、SSR、および Tauri / Electron の適応を提供します。各 CSS コンポーネントには独自の G* エクスポート時に、AI はスタイルを再構築せずにコンポーネントを直接選択できます。
506 コンポーネント
538 ランタイムエクスポート
29 エントリ ポイント
28 CSS パック
Vue 3.4+
App.vueオンデマンドインポート・コンプリートタイプ
<script setup lang="ts">
import { GButton, GCard, GardenerProvider } from "@gardener/vue";
import "@gardener/vue/style.css";
</script>
<template>
<GardenerProvider theme="garden" mode="light" shape="subtle">
<GCard>
<GButton variant="primary">保存</GButton>
</GCard>
</GardenerProvider>
</template>
公式 React バインディング · 1.0.0 安定版
同じ CSS セットに完全な React コンポーネント モデルもあります
@gardener/react 506 個の CSS コンポーネントと 66 個の DOM 動作をタイプセーフな React API にマッピングし、正確なネイティブ要素タイプ、10 軸のテーマプロバイダー、制御された値と制御されていない値のブリッジング、命令型ハンドル、7 つのフック、SSR / ハイドレーション、および分離された Tauri / Electron 適応入口を提供します。コンポーネント、スタイル、および機械可読ディレクトリは 1 対 1 の対応を維持します。
506 コンポーネント
538 ランタイムエクスポート
29 エントリ ポイント
28 CSS パック
React 18.3-19.xの
App.tsxオンデマンドインポート・コンプリートタイプ
import { GButton, GCard, GardenerProvider } from "@gardener/react";
import "@gardener/react/style.css";
export function App() {
return (
<GardenerProvider theme="garden" mode="light" shape="subtle">
<GCard>
<GButton variant="primary">保存</GButton>
</GCard>
</GardenerProvider>
);
}
公式 AngularJS バインディング · 1.0.0 安定版
大規模な AngularJS レガシー システムで完全な Gardener API を引き続き使用できるようにする
@gardener/angularjs 506 個の CSS コンポーネントと 66 個の DOM 動作を AngularJS 要素/属性ディレクティブにマッピングし、モジュール ファクトリ、厳密なコンポーネントのサブセット化、ネイティブ ngModel、10 軸テーマ、3 つの注入可能なサービス、動的なライフ サイクル、分離された Tauri / Electron エントリを提供します。これは、AngularJS 1.8.x を維持する必要があるストック製品を対象とし、フレームワークの EOL セキュリティ境界を明示的に公開します。
506 ディレクティブ
535 ランタイムエクスポート
29 エントリ ポイント
28 CSS パック
AngularJS 1.8.2–1.8.3
app.jsモジュールファクトリー・ngModel・完全型
import "angular/angular.js";
import { createGardenerAngularJS } from "@gardener/angularjs";
import "@gardener/angularjs/style.css";
const gardener = createGardenerAngularJS(window.angular, {
components: ["button", "input", "card"],
});
window.angular.module("app", [gardener]);
// <button g-button gardener-variant="primary">保存</button>
// <input g-input ng-model="vm.keyword">
公式 Blazor RCL · 1.0.0 安定版
同じ Razor コンポーネント セットを使用した静的 SSR からデスクトップ WebView へ
Gardener.Blazor 506 個の CSS/ハイブリッド コンポーネント、66 個の DOM 動作、および 75 個のイベントを、厳密に型指定された Razor API にマップします。安定したパッケージ
net10.0 はベースラインであり、検証済みです net11.0
消費。Blazor Web App、WebAssembly、Hybrid、Tauri、および Electron のシナリオをカバーし、SSR、Forms、Accessibility、および Ten-axis テーマのコントラクトを保持します。
506 コンポーネント
66 の動作
75 イベント
43 の静的アセット
.NET 10/11
ダッシュボード.razorRCL · SSR · 厳密に型指定されたイベント
@using Gardener.Blazor.Components
<GardenerProvider Theme="garden" Mode="light"
Shape="small" Platform="desktop">
<GAppShell>
<GSidebar>ナビゲーション</GSidebar>
<GMainRegion>
<GButton Variant="primary" @onclick="Save">
保存
</GButton>
</GMainRegion>
</GAppShell>
</GardenerProvider>正確な列分割、一時的な計算は不要になりました
24 グリッドはエンタープライズ バックエンド、CMS、複雑なフォームをカバーし、12 グリッドは従来のデザイン ドラフトと互換性があります。列幅、オフセット、順序、グリッド線、間隔、コンテナ クエリ、RTL、印刷用の安定したインターフェイスがあります。
5 レベルのビューポート応答 + 3 レベルのコンテナ応答480 / 768 / 1024 / 1280 / 1536px · CQ 480 / 768 / 1024px
ラスター ドキュメント全体を表示
従来のページ スケルトン、安定したインターフェイスも備えています
上下のメインエリア、左右の列から聖杯、マスター/ディテール、ドック、調整可能な列と全画面ワークスペース、Web、モバイル端末、Tauri/Electron をページレベルのレイアウト CSS を一時的に記述することなく直接選択できます。
上/メイン/下スタート/メイン/エンド聖杯マスター/詳細リスト/詳細/検査者固定ヘッダーサイドバーを修正粘着性のある脇スティッキーフッタードック分割ビューフルスクリーンモバイルセーフエリアデスクトップシェルコンテナクエリRTL/印刷
完成スケルトン16種＋統一エリアパーツビューポートの応答性 · コンテナーの応答性 · 論理方向 · 印刷のフラット化 · デスクトップ ワークベンチ
ゾーン レイアウトの完全なドキュメントを表示する
スペースによってレイアウトを決定し、ブレークポイントにレイアウトを推測させないでください
スタック、クラスター、サイドバー、スイッチャー、リール、メディア オブジェクト、メイソンリー、ベントなどの古典的なパターンが、固有の応答インターフェイスに統合されました。 AI は意図といくつかの変数を選択するだけでよく、フレックス、グリッド、オーバーフロー、安全領域のルールを再発明する必要はありません。
スタック
クラスターラップタグ
撃退
M
メディア オブジェクトメディア・ボディ・アクション
→
スタッククラスターセンターサイドバースイッチャーカバーリールフレームメディア オブジェクト自動フィットオートフィルブリード撃退詐欺師オーバーレイ石積みお弁当アスペクト比スクロールエリアスクロールスナップ安全領域粘着領域
22 の安定したプリミティブ + JavaScript レイアウトなし組み込み応答 · コンテナ クエリ · RTL · セーフ エリア · 縮小モーション · 印刷
完全な基本ドキュメントを表示する
ページのパブリック構造、配信状態に直接入る
ページ ヘッダー、ツールバー、コマンド バー、フィルタリング、バッチ操作を統合し、読み込み中、空、エラー、403、404、500、オフライン、メンテナンスのステータスを完全に準備します。 AI によって生成されたページはもはや単なる「通常のデータ」ではありません。
コンテンツワークスペース
ページ管理
コンテンツ、ステータス、公開時間を管理します。
∅
空
初めて使用する場合の明確な次のステップもあります。
404
見つかりません
無効なリンクに対する安定したフォールバック。
⌁
オフライン
ネットワークが切断されても、データ セキュリティ ステータスが通知されます。
ページヘッダーセクションヘッダーサブヘッダーツールバーアクションバーステータスバーコマンド バーコンテキストバーフィルターバーバルクアクションバーフッターバーフローティングアクションバートップに戻るテキスト付きの仕切りスティッキーアクションページの読み込み中ページが空ですページエラー403404500オフラインメンテナンス
23 の完全なページ状態と共通構造コンテナ クエリ · スティッキー · セーフ エリア · RTL · ランタイム · 印刷
全ページのコンポーネント ドキュメントを表示する
ヒントから完全なヘルプの閉ループへ
ツールチップ、ポップオーバー、吹き出し、FAQ、ヘルプセンター、ツアー、スポットライト、新機能のヒント、トラブルシューティング、フィードバックはすべて安定したインターフェイスを使用します。ユーザーは端で質問に遭遇したとき、適切かつ一貫した表現をします。
実稼働環境に公開する前に、プレビュー環境を使用してコンテンツを確認します。
- ヘルプを開く?
- コマンド パネルCtrl+K
ヒントインラインヒントヘルプテキストヘルプトリガーツールチップ豊富なツールチップヘルプポップオーバー定義吹き出し注記する/しないでくださいキーヒントショートカット一覧ヘルプカードヘルプパネルヘルプセンターヘルプ トピックよくある質問コンテキストヘルプコーチマークガイド付きツアースポットライトホットスポット機能のヒント新機能ヘルプ チェックリストトラブルシューティングヘルプのフィードバック
28 のプロンプト、ガイダンス、サポート モード衝突認識 · キーボード · フォーカス復元 · RTL · モーション軽減 · 印刷
完全なヘルプ システム ドキュメントを表示する
フォームが大量の入力で始まらなくなりました
フィールド、パーティション、水平およびインラインレイアウト、検索/パスワード/カウント、グループの選択、検証、名前/アドレス/金額、条件と反復可能性、レビューおよび送信アクションがすべて組み合わされています。 AI はビジネス目的を選択するだけでよく、フォーム CSS を何度も整理する必要はありません。
フォームフォームセクションフィールドフィールドセットフォーム行フォームグリッド横型フォルムインラインフォームコンパクトなフォルム入力グループ入力接辞検索フィールドパスワードフィールドクリア可能なフィールドキャラクターカウンター検証状態検証の概要チェックボックスグループ無線グループスイッチ列チョイスカード名前グループアドレスグループ電話グループマネーグループ日付範囲時間範囲単位フィールド範囲フィールドファイルフィールド反復可能なフィールド条件付きフィールドフォームアクション自動保存ステータスフォームの進行状況フォームのレビュー同意グループ
37 種類の伝統的なフォーム構造 + 5 種類のインタラクティブな動作コンテナクエリ · 検証 · ビジネスグループ · RTL · セーフエリア · 印刷
フォームの組み合わせに関する完全なドキュメントを表示する
データは表示するだけでなく、すぐに利用できる必要があります
テーブル、レコード、リスト、階層、インジケーター、プラン、マップ、操作をカバーする 48 のデータ モード。並べ替え、選択、展開、列管理、フィルタリング、およびビュー切り替えのための統合されたランタイムがあります。
顧客収益¥286K
128アクティブ
6リスク
選択済み 0 アイテム
| ステータス | 操作 | |||
|---|---|---|---|---|
| ギャラクシーテクノロジー | アクティブ | ¥128,000 | ||
|
Enterprise Edition のお客様 · 最終連絡は 2 日前
|
||||
| 圓山デザイン | 経過観察中 | ¥86,000 | 表示 | |
| 臨海教育 | リスク | ¥42,000 | 表示 | |
テーブルレスポンシブテーブルデータグリッド編集可能なグリッドツリーテーブルグループ化されたテーブル拡張可能なテーブル比較ピボット説明リストキー値レコードの詳細リストグループメディア一覧密集リスト仮想リスト木タイムラインアクティビティ フィード監査ログKPIステータス一覧メトリックカードスパークライン進行状況の統計チャート凡例ランキングステータスの概要カレンダー議題カンバンガントチャート組織図地図マトリックスヒートマップデータツールバー列選択ツール保存されたビューエクスポートパネルデータの状態ビュースイッチャー選択の概要密度フィルターの概要ソートビルダーデータインスペクター
48 種類のデータ表示および操作モード + 8 種類の再利用インタラクションテーブル、レコード、メトリック、プランニング、空間、キーボード、RTL、印刷
完全なデータ結合ドキュメントを表示
1 つの項目の選択から 100,000 レコードの処理まで
すべて選択、反転選択、範囲選択、バッチ ツールバー、転送、ツリーおよびカスケード選択、人/組織/リソース/メディア セレクター、日付時刻範囲、設定の保存、並べ替え/グループ ビルダーはすべて安定したインターフェイスを備えています。 AI は複雑なバックエンド選択プロセスを即興で行う必要はありません。
選択コントロールすべて選択反転範囲バッチツールバー選択範囲転送デュアルリストツリー選択カスケードメンションピッカーユーザーピッカー組織ピッカーリソースピッカーメディアピッカーアイコンピッカーカラーピッカー日付範囲時間範囲保存されたフィルター保存されたビュー列選択ツールソートビルダーグループビルダーエンティティピッカータグピッカーリレーションピッカー一括確認一括進行状況ピッカーパネルピッカーの概要選択の概要
32 の選択はバッチ モード + 7 カテゴリの多重化と相互作用します複数選択、階層、検索、セーフエリア、キーボード、RTL、印刷
選択コンポーネントの完全なドキュメントを表示する
ファイルのアップロードからコンテンツ制作全体の完了まで
アップロード キュー、ファイルの参照、メディア ライブラリ、画像処理、ドキュメント/PDF/オーディオとビデオの表示、コードとリッチ テキストの編集、マークダウン、ブロック、リビジョン、コメント、自動保存はすべて既製の構造を持っています。
コーポレートブランドマニュアル.pdf
ホームページの表紙.jpg
PDF
ブランドマニュアル.pdf
IMG
ホームページの表紙.jpg
ファイルドロップファイルリストアップロードキューチャンクのアップロードアップロードの進行状況アップロードに失敗しましたファイルカードフォルダーツリーファイルブラウザファイルのプレビューメディア ライブラリメディアグリッドメディアの詳細画像のトリミング画像の注釈ドキュメント ビューアPDF ビューアビデオプレーヤーオーディオプレーヤーコードエディタリッチ テキスト エディターマークダウン エディターブロックエディターリビジョン比較自動保存コンテンツ概要エディター ツールバー検索と置換コメントスレッドバージョン履歴ファイルのプロパティストレージメーター
32 のファイルおよびコンテンツ モード + 6 種類の再利用インタラクションアップロード · ブラウザ · エディタ · リビジョン · キーボード · RTL · 印刷
コンテンツ システムの完全なドキュメントを表示する
最初のログインからすべてのセキュリティ監査まで
ログイン、登録、検証、MFA、パスキー、SSO、QR コード、招待、アカウントとテナントの選択、ロック画面、セッション回復、デバイス管理、セキュリティ イベントが、Web サイト、モバイル端末、ダッシュボード、Tauri/Electron に適した安定したページ構造に統合されました。
+86 138****6608 に送信された確認コードを入力してください
新しいデバイスが検出されました
Linux · Firefox、北京から発売。
集中認証分割認証サインイン登録パスワードの回復パスワードのリセット電子メールの検証電話認証MFAOTPパスキーSSOQRログインマジックリンク招待状最初のセットアップロック画面セッションが期限切れになりましたアカウント選択ツールテナント選択者ID スイッチャープロファイルのセットアップアカウントのセキュリティデバイスログインアクティビティセキュリティ警告リカバリー コード信頼できるデバイス接続されたアカウントパスワードの強度同意認証結果
32 のログインおよびアカウント モード + 8 種類の再利用インタラクションパスワード、OTP、MFA、パスキー、SSO、セッション、アイデンティティ、セキュリティ
アカウント システムの完全なドキュメントを表示する
商品の確認から取引完了、返金まで
製品カード、詳細、SKU、ショッピング カート、チェックアウト、住所、配送、オファー、請求書、支払い、注文、サブスクリプション、使用状況、請求、返金が安定した構造になりました。電子商取引、デジタル商品、SaaS、企業調達、CMS の商品化、デスクトップ クライアントに適しています。
エンタープライズ版Gardenerスタジオ
スタジオ ビジネス スイート
¥699¥899-22%
プラットフォーム
G
スタジオ ビジネス スイートWindows · Enterprise ライセンス
¥699.00
ショッピングカートは空です
商品
割引
配送
対処
プロダクトカード製品一覧商品詳細製品ギャラリーSKU セレクター数量ステッパー価格表示カート商品カートミニカートカートの概要チェックアウトチェックアウト手順アドレスセレクターアドレスカード配送方法ピックアップセレクタークーポンプロモーションリスト請求書情報お支払い方法支払いシート支払い結果注文概要注文スケジュール注文詳細サブスクリプション プラン価格比較使用量メーター請求履歴返金ステータス税金の概要
32 のビジネスおよび支払いモデル + 7 種類の再利用インタラクションカタログ、カート、チェックアウト、フルフィルメント、支払い、注文、請求
ビジネスおよび支払いに関する完全な文書を表示
小さなデスクトップではなく、完全なモバイル アプリ層
セーフ エリア、ダイナミック ビューポート、トップ バー、ボトム ナビゲーション、ボトム/アクション/フィルター シート、プルして更新、無限ロード、スライド操作、ホイール選択、キーボード回避、モバイル認証と決済、権限とオフライン ステータスには安定した契約があり、モバイル Web ページ、PWA および Tauri/Electron モバイル WebView に直接使用できます。
コンテンツ センター
ノッチとホーム インジケーターの自動保護。
PWA、Tauri、および Electron の共有構造。
モバイル コンテンツのストリーミング
安定したメディア、ボディ、テールアクションスロット。
セーフエリアシェルトップアプリバー下部のナビゲーションボトムシートアクションシートプルしてリフレッシュ無限ロードスワイプアクションタブのスワイプモバイル カテゴリモバイルフィルタースティッキー購入バーモバイル検索モバイルピッカーホイールピッカーフローティングアクションボタン全画面ダイアログキーボードの回避ジェスチャーのヒントオフライン バナーセグメント化されたコントロールモバイル フィードカードカルーセルモバイルフォームモバイル認証モバイル チェックアウトメディアビューアキーボード ツールバー選択モードスナックバー許可のプロンプト空/エラー状態
32 のモバイル固有モード + 14 種類の再利用インタラクションセーフエリア · タッチ · シート · ジェスチャー · キーボード · PWA · WebView
完全なモバイル ドキュメントを表示する
Web テクノロジーを完全なデスクトップ ワークスペースに変える
ネイティブのタイトル バー、ウィンドウ ボタン、メニュー、およびアクティビティ バーは出発点にすぎません。ドキュメント ラベル、調整可能な列、Dock、インスペクター、コマンド パネル、ファイル選択、トレイ、マルチ ウィンドウ、バックグラウンド タスク、更新、アクセス許可、クラッシュ リカバリがすべて安定して組み合わされており、Tauri と Electron に直接実装できます。
デスクトップ CMS
高密度のワークスペースで再組み立ては不要
ウィンドウ Chrome、ナビゲーション、編集エリア、ステータスエリア、ホストブリッジはそれぞれ独立した契約を持っています。
ネイティブ タイトルバーウィンドウ コントロールメニューバーアクティビティバードックパネルサイズ変更可能な分割ペイン検査官ステータスバーコマンドパレットショートカットレコーダーコンテキスト メニュー未保存のタブ領域をドラッグウィンドウの読み込みアップデートが利用可能許可リクエストネイティブ ファイル ピッカートレイメニューマルチウィンドウデスクトップワークスペースウィンドウスイッチャー最近のドキュメントデスクトップ ツールバー底面パネルバックグラウンドタスク通知センター同期ステータスアップデートの進行状況クラッシュからの回復単一インスタンスディープリンクダイアログについて
32 のデスクトップ固有モード + 11 種類の再利用可能なインタラクションTauri · Electron · Window Chrome · ワークスペース · ネイティブ ブリッジ · ライフサイクル
デスクトップの完全なドキュメントを表示する
AI インタラクションはチャット ボックスではありません
対話に加えて、Composer とストリーミング回答、推論の要約、ツールの呼び出しと承認、マルチエージェント オーケストレーション、ソース引用、アーティファクト、コンテキスト メモリ、トークン/料金、音声、権限、プライバシー、セキュリティ レビュー、フィードバック評価も必要です。 Gardener は、AI タスク チェーン全体を直接再利用できる 32 のモードにします。
Super CMS のエンタープライズ ポータル ホームページを生成します。
エンタープライズ ポータルのレシピが選択され、コンポーネントと権限がチェックされています。
ダッシュボード、CMS、権限、デスクトップ ワークスペースの一致。
ページ テンプレートへの書き込みを許可しますか?
現在のプロジェクトの生成されたディレクトリのみを変更します。
AI ワークスペース会話リストチャット スレッドAIメッセージプロンプトコンポーザーアタッチメントプロンプトスタータープロンプト ライブラリメンション/スラッシュメニューモデルセレクター思考ストリーミング応答ツールコールツールの承認エージェントのステータスエージェント プランマルチエージェントボードエージェントのハンドオフ出典/引用アーティファクトワークスペースアーティファクトパネルAI ファイル ツリーバージョン履歴ジェネレーションギャラリー生成プレースホルダーコンテキスト/メモリコスト/レート制限ボイスセッション権限の範囲プライバシーに関する通知安全上の注意フィードバック/評価
32種類のAIネイティブモード+9種類のランタイムチャット、マルチモーダル、ツール、エージェント、アーティファクト、コンテキスト、安全性、評価
AI コンポーネントの完全なドキュメントを表示する
コンポーネント ライブラリから、直接生成できる完全なページに移動します
カテゴリ 16 は、公開 Web サイト、個人コンテンツ、エンタープライズ バックエンド、ビジネス ワークベンチ、および垂直産業ポータルを 32 の全ページ契約に統合します。 AI はまずページの種類を選択し、次にビジネス コンポーネントとコンテンツを入力します。ヘッダー、ナビゲーション、メインエリア、サイドエリア、モバイルの折りたたみルールを一時的に作成することはなくなりました。
企業の概要
スーパー CMS 動作概要
同じ全ページ契約書で、ビジネス、個人、医療、金融、または公共サービスのトピックを切り替えることができます。
公開サイト28,640↑ 12.4%
ページテンプレート486k32 のフルページエントリ
審査待ち138処理が必要です
製品の着陸企業ホーム個人宅ポートフォリオブログインデックス記事ドキュメントポータルヘルプセンター検索結果お問い合わせ価格ダッシュボード管理者リストレコードの詳細設定ユーザー センター通知オンボーディングCRMプロジェクト ワークスペースサポートセンター承認センターナレッジベース学習ポータルイベントポータル予約ポータルヘルスケア金融公共サービスマーケットプレイスコミュニティステータス センター
32 のフルページ モード + 52 の機械可読レシピ個人、エンタープライズ、コンテンツ、運用、業界、クロスプラットフォーム
完全なソリューション ドキュメントを表示
42 色のテーマ
ブランドは変更しますが、コンポーネントは変更しません
カラーテーマは、ニュートラル、フォント、形状、濃度、レイヤー、アニメーション、プラットフォーム、オペレーティング システムと直交して組み合わされます。ここでは白と明るいインターフェースが常に維持され、メインのブランドカラーのみが切り替わります。
プライマリー
飾りすぎずクリア
ボタン、リンク、フォーカス、および選択された状態は自動的にテーマに従います。
キーボード操作可能。各テーマは、50 ～ 950 の完全なカラー グラデーションと独立して読み取り可能な前景色を提供します。
予測可能なオーサリング · 安定版 1.0.0
HTML はインターフェースです
統一
g-
プレフィックス、安定したコンポーネントの命名、および宣言
data-g-* 人間と AI の両方がすぐに理解できる動作。
- レイヤーごとにインポートコア/テーマ/ユーティリティ/コンポーネント/AI
- 宣言型ランタイム自動初期化と動的 DOM 観察
- 機械可読パブリック API、コンポーネント、ツール クラス、レシピ、機能のリスト
- 厳密な検証11 セットのクローズド スキーマ、48 の標準スキーマ ユース ケース、10 のビルド固有のユース ケース、66 のランタイム単体テスト、125 の実際のブラウザのユース ケース、および 24 の構造のユース ケース
index.html
<html data-g-theme="garden" data-g-mode="light">
<link rel="stylesheet" href="gardener.css">
<main class="g-dashboard">
<article class="g-card g-p-5">...</article>
</main>
<script type="module" src="gardener.runtime.js"></script>
</html>現在のページに本当に必要なプラットフォームとコンポーネントのみを提供します
5 つのプラットフォーム ファイル、28 の安定したコンポーネント パッケージ、および 506 のコンポーネント所有権マッピングにより、開発者と AI は一時的に CSS を逆アセンブルすることなく公式製品を直接選択できます。構文レベルの圧縮、ソース マップ、SHA-256/SRI の整合性、再現可能なビルド、TypeScript タイピング、バージョン間の互換性ベースライン、およびリリース パッケージ ゲーティングがビルドとともに提供されます。
プラットフォーム ファイル
Web、モバイル、デスクトップ、Tauri、および Electron は、対応するエンド機能を自動的に保持します。
コンポーネント パッケージ
レイアウト、フォーム、ナビゲーション、データ、コンテンツ、アカウント、コマース、モバイル、デスクトップ、AI はすべて独立して導入できます。
コンポーネントの所有権
各パブリック コンポーネントは、明示的なインクルージョンがリストされた、それが属する完全なパッケージに解決されます。
デュアル製品予算
raw、gzip、Brotli の絶対上限と 0.9.0 ベースラインの増加により、制限を超えるとリリースがブロックされます。
互換性のあるベースライン
エントリ、テーマ、ランタイム、コンポーネント、レシピは追加のみ可能です。削除するには、少なくとも 2 つのマイナー バージョンの廃止期間を経過する必要があります。
npm run build:platform -- --platform mobile --out dist/custom/mobile-app
npm run build:custom -- --components button,card,dialog --out dist/custom/account-ui
npm run verify:reproducible
npm run verify:compatibility
npm run test:types
npm run verify:package
npm run budgetすべてのページは実際の環境に耐える必要があります
デフォルトで 125 の実際のブラウザのユース ケースと 24 の HTML 構造のユース ケースを実行します。完全な構成には、デスクトップの 3 つのエンジン、Android/iPhone デバイスのポートレート、および WCAG 自動チェックが含まれます。
デスクトップ マルチブラウザ
Chromium と WebKit はデフォルトのアクセス制御に入ります。 Firefox は、独立した 3 つのエンジンによる完全なアクセス制御を提供します。
モバイルデバイス
Pixel 7 と iPhone 13 は 21 のサンプルとホーム 2 ページで完全にカバーされており、320 ピクセルの狭い画面、横画面、リフロー、44 ピクセルのタッチ ターゲットを確認します。
アクセシビリティ
Axe WCAG 2 A/AA すべての自動違反がゼロになり、キーボードとフォーカスの回復、RTL、モーションの減少、強制カラーがカバーされます。
構造の完全性
全 21 例、ホーム ランディング ページとドキュメント チェック解析、ID、ARIA 参照、タイトル、ビューポート。
同じ言語がすべての端末に適用されます
ページ構造、テーマ トークン、およびインタラクション セマンティクスは一貫しており、必要な密度、ウィンドウ、およびセーフ ゾーンの適応のみが両端に追加されます。
PCサイト
エンタープライズ Web サイト、ポータル、コンテンツ Web サイト、電子商取引、および SaaS。
モバイルウェブ/PWA
セーフエリア、タッチ密度、下部ナビゲーションおよびカテゴリページ。
ダッシュボード
高密度データ、テーブル、フィルター、および複数列のアプリケーション。
Tauri / Electron
デスクトップのタイトル バー、ウィンドウ ブリッジ、およびワークベンチのレイアウト。
AI 製品
メッセージ、ツール、エージェント、アーティファクト、ビルド状態のストリーミング。
高頻度のページを再構築する必要はありません
複雑だが再利用性の高いページがレシピに結合されました。 AI は最初にレシピを選択し、次にコンポーネントとツール クラスを使用して限定的な調整を行う必要があります。
AI に推測させず、AI に選択させます
パブリック API、コンポーネント、ツール クラス、レシピ、業界機能の 5 つのカテゴリのリストは、許可された名前、入り口、プラットフォーム、ステータス、および応答条件を構造化された方法で公開します。ページ生成プロセスは、制約、検証、再現できます。
ページの意図を特定する
エンドタイプ、ビジネスカテゴリ、密度、コンテンツ量、およびインタラクションの複雑さ。
レシピ選択を優先する
52 の完成した構造から最も近いページ スケルトンを選択します。
コンポーネントとツールの組み合わせ
マニフェストに実際に存在するパブリック API、クラス、および動作のみを使用してください。
契約と環境を確認する
スキーマ、キーボード、アクセシビリティ、RTL、印刷、および応答エンドポイントのチェックに合格します。
完全なシステムから始めます。
次のページに向けてインフラストラクチャを再発明するのはやめてください。