Zenn
Open18

TailwindCSSベースのUIフレームワークを色々探す

Tailwind CSS
Hidden comment
Hidden comment
sev3e3esev3e3e

daisyUI

https://daisyui.com/

https://github.com/saadeghi/daisyui

<div className="overflow-x-auto">
  <table className="table w-full">
    <!-- head -->
    <thead>
      <tr>
        <th></th>
        <th>Name</th>
        <th>Job</th>
        <th>Favorite Color</th>
      </tr>
    </thead>
    <tbody>
      <!-- row 1 -->
      <tr>
        <th>1</th>
        <td>Cy Ganderton</td>
        <td>Quality Control Specialist</td>
        <td>Blue</td>
      </tr>
      <!-- row 2 -->
      <tr>
        <th>2</th>
        <td>Hart Hagerty</td>
        <td>Desktop Support Technician</td>
        <td>Purple</td>
      </tr>
      <!-- row 3 -->
      <tr>
        <th>3</th>

良さげ

Hidden comment
Hidden comment
sev3e3esev3e3e

a17t

https://a17t.miles.land/

https://github.com/milesmcc/a17t

a17t は、field、button、cardなどのアトミック コンポーネントを、プロジェクトに合わせてスケーリングするニュートラルなデザイン言語で提供する Tailwind CSS プラグインです。

🤔?

CSSフレームワークの中には、様々なコンポーネントがあらかじめパッケージされているものがあり、最初は便利なのですが、すぐに制限されてしまいます。Tailwindのようなユーティリティフレームワークは素晴らしいですが、単独で使い始めるのは難しいかもしれません。

a17tは、そのバランスをうまく取ろうとしています。(ジャンボトロン、ナビバー、メニューのような）すべてを含んだ、意見の分かれるコンポーネントを提供する代わりに、a17t はデフォルトの（しかし簡単にカスタマイズできる）スタイルで共通のシングルクラスの要素を提供します。そして、Tailwind のプラグインなので、あなたのプロジェクトにシームレスに統合することができます。

最小限のスタイリングがウリみたいです。

あとドキュメントがすごい充実してます。