Tailwind CSSの基本や押さえておきたい特徴を中心に、TailwindベースのFigmaファイルを作成する方法までをこもりまさあきさんに解説いただきます。
本イベントは有料イベントとして開催します。
無料での配信は行わず、お申し込みいただいた方のみに配信URLをお知らせします。
アーカイブ（と当日の配信）はサブスクの対象ですが、こもりまさあきさんの「Tailwind CSS v4 実践ガイド」講座（7,700円）は付属しません。
これから覚えるTailwind CSS
非エンジニアでも、AIエージェントや各種サービスを活用すれば、プロンプトで指示するだけで手軽にモックアップを作成できる時代になりました。
サイトやアプリの画面をコード化するサービスの多くは、特別な技術仕様を指定しない限り、「Tailwind CSS」をベースにレイアウトやデザインを構築します。そのため、Tailwind CSSの基本を少しでも理解しておくと、プロンプトだけでは意図がうまく伝わらない場合でも、自分で簡単に調整できるようになります。
今回は、Tailwind CSSの基本や押さえておきたい特徴を中心に、TailwindベースのFigmaファイルを作成する方法まで解説します。
アジェンダ
AIが Tailwind CSS を好む理由（5分）
他のCSSフレームワークと何が違う？（5分）
ユーティリティファースト？（5分）
まずは自分で書いてみよう（10分）
今度はAIに書いてもらおう（10分）
できたコードを確認してみよう（10分）
VSCodeの拡張機能とコード補完（5分）
（休憩）
覚えておきたいサイズの法則（5分）
答えはすべて公式サイトに（5分）
クラス名の意味するところ（5分）
プリフィクスを使ってできること（10分）
Figmaのファイルはこう作れ（10分）
既存のCSSをTailwind に移植できる？（10分）
AIにコードを書かせるときの注意点（5分）
特典
本イベントには、こもりまさあきさんの「Tailwind CSS v4 実践ガイド」講座（7,700円）が付属します。
こもりまさあき1990年代前半に都内のDTP系デザイン会社にてアルバイトをはじめる。大学卒業後そのまま正社員となり、入出力業務、デザイン業務、ネットワー...
プラットフォーム: techplay
関連タグ
関連タグ
関連タグ
関連タグ
