guokaigdg/animal-island-ui

これは何？

主な機能

• 01TypeScriptで記述されたReactコンポーネントを提供します。
• 02コンポーネントのスタイルとフォントを含むスタイルシートを、1回のimportで読み込めます。
• 03島をイメージした統一感のあるデザインのオリジナルアイコン、イラスト、アニメーションを収録しています。
• 04オンラインデモサイトと、ドキュメント化されたデザインシステム仕様書を用意しています。
• 05AIコーディングエージェントがこのスタイルのページを生成するための、インストール可能なskillを収録しています。

ユースケース

• かわいらしいビジュアルが必要な、遊び心のある一般向けアプリ、ゲーム風ダッシュボード、個人サイトの構築。
• スタイル適用済みのコンポーネントを使った、ランディングページや商品一覧の素早いプロトタイピング。
• コードを書かずに、AIツールでこのスタイルの独立したHTMLページを生成。

クイックスタート

1. 1

   パッケージをインストールする

   npm install animal-island-ui
2. 2

   スタイルをインポートする（コンポーネントを正しく表示するために必要）

   import 'animal-island-ui/style';
3. 3

   アプリでコンポーネントを使用する

   import { Button, Card } from 'animal-island-ui';

使う前に知っておきたいこと

• !'animal-island-ui/style' をインポートしないと、コンポーネントにスタイルやフォントが適用されません。

トピック

よくある質問

animal-island-ui とは？

オリジナルのアイコン、イラスト、アニメーションを備えた、島をイメージした居心地のよいReact・TypeScript UIコンポーネントライブラリ。 Animal-Island-UIは、遊び心のある居心地のよいビジュアルが特徴の、軽量なReact・TypeScriptコンポーネントライブラリです。ボタンやカードなどのコンポーネントは一貫したデザインシステムに沿っており、アイコン、レイアウト、アニメーションは既存のキットから流用せず、このプロジェクト向けに制作されています。

animal-island-ui は無料で使えますか？ライセンスは？

animal-island-ui は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

animal-island-ui は今もメンテナンスされていますか？

活発にメンテナンス中。animal-island-ui の最終コミットは 2026年10月19日 です。

animal-island-ui は何に使えますか？

かわいらしいビジュアルが必要な、遊び心のある一般向けアプリ、ゲーム風ダッシュボード、個人サイトの構築。 スタイル適用済みのコンポーネントを使った、ランディングページや商品一覧の素早いプロトタイピング。 コードを書かずに、AIツールでこのスタイルの独立したHTMLページを生成。

animal-island-ui のインストール方法は？

パッケージをインストールする: npm install animal-island-ui スタイルをインポートする（コンポーネントを正しく表示するために必要）: import 'animal-island-ui/style'; アプリでコンポーネントを使用する: import { Button, Card } from 'animal-island-ui';

animal-island-ui はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/guokaigdg/animal-island-ui