TailwindCSS 3.0.24 全ユーティリティクラス markdown形式

TailwindCSS 3.0.24

Tailwind CSS Cheat Sheet
https://www.creative-tim.com/twcomponents/cheatsheet/

※すべてのユーティリティクラス(複数のCSSプロパティ)を網羅
※中間の数字は省略 (表示:最小～最大)
※色の組み合わせは省略

----------------------------------------

# Layout

## Aspect Ratio

要素のアスペクト比を制御するユーティリティ。

aspect-auto
aspect-square
aspect-video


## Container

現在のブレークポイントの最小幅と一致するように最大幅を設定します。

container
			none
			sm (640px)
			md (768px)
			lg (1024px)
			xl (1280px)
			2xl (1536px)

## Columns

要素内の列数を制御するユーティリティ。

columns-1
columns-12
columns-auto

columns-3xs
columns-xs

columns-sm
columns-md
columns-lg
columns-xl
columns-7xl

## Break After

要素の後に列またはページを分割する方法を制御するユーティリティ。

break-after-auto
break-after-avoid
break-after-all
break-after-avoid-page
break-after-page
break-after-left
break-after-right
break-after-column

## Break Before

要素の前で列またはページを区切る方法を制御するユーティリティ。要素の前で列またはページを区切る方法を制御するユーティリティ。

break-before-auto
break-before-avoid
break-before-all
break-before-avoid-page
break-before-page
break-before-left
break-before-right
break-before-column

## Break Inside

要素内で列またはページを分割する方法を制御するユーティリティ。

break-inside-auto
break-inside-avoid
break-inside-avoid-page
break-inside-column

## Box Decoration Break

複数の行、列、またはページにわたって要素フラグメントをレンダリングする方法を制御するユーティリティ。

decoration-slice
decoration-clone

## Box Sizing

要素の合計の幅と高さの計算方法を設定します。

box-border
box-content

## Display

要素の表示ボックスのタイプを設定します。

block
inline-block
inline
flex
inline-flex
table
inline-table
table-caption
table-cell
table-column
table-column-group
table-footer-group
table-header-group
table-row-group
table-row
flow-root
grid
display: grid
inline-grid
contents
list-item
hidden

## Float

要素の配置をコンテナの側面に設定し、コンテンツがその周囲を囲むようにします。

float-right
float-left
float-none

## Clear

要素を先行する浮動要素の下に移動するかどうかを設定します。

clear-left
clear-right
clear-both
clear-none

## Isolation

要素を先行する浮動要素の下に移動するかどうかを設定します。

isolate
isolate-auto

## Object Fit

置換された要素 (img または video タグ) のコンテンツのサイズを変更する方法を設定します。

object-contain
object-cover
object-fill
object-none
object-scale-down

## Object Position

選択した置換要素の配置を設定します。

object-bottom
object-center
object-left
object-left-bottom
object-left-top
object-right
object-right-bottom
object-right-top
object-top

## Overflow

コンテナに対して大きすぎるコンテンツを処理する方法を設定します。

overflow-auto
overflow-x-auto
overflow-y-auto

overflow-hidden
overflow-x-hidden
overflow-y-hidden

overflow-visible
overflow-x-visible
overflow-y-visible

overflow-scroll
overflow-x-scroll
overflow-y-scroll

scrolling-touch
scrolling-auto

## Overscroll Behavior

スクロール領域の境界に到達したときのブラウザの動作を制御するためのユーティリティのセット。

overscroll-auto
overscroll-y-auto
overscroll-x-auto

overscroll-contain
overscroll-y-contain
overscroll-x-contain

overscroll-none
overscroll-y-none
overscroll-x-none

## Position

要素の位置を設定します。

static
fixed
absolute
relative
sticky

## Top / Right / Bottom / Left

位置決めされた要素の配置を設定します。

-bottom-0
	96
	full

-inset-0
	-96
	-full
	-x-0
	-x-96
	-x-full
	-y-0
	-y-96
	-y-full

-left-0
	96
	full

-right-0
	-96
	-full

-top-0
	-96
	-full

bottom-0
	-96
	-auto
	-full

inset-0
	-96
	-auto
	-full
	-x-0
	-x-96
	-x-auto
	-x-full
	-y-0
	-y-auto
	-y-full

left-0
	-96
	-auto
	-full

right-0
	-96
	-auto
	-full

top-0
	-96
	-auto
	-full

## Visibility

ドキュメントのレイアウトに影響を与えずに表示または非表示を切り替えます。

visible
invisible

## Z-index

位置決めされた要素の Z オーダー (「スタック順序」) を設定します。

z-0
z-50
z-auto

----------------------------------------

# Flexbox & Grid

## Flex basis

フレックス項目の初期サイズを制御するユーティリティ。

basis-0
basis-96

basis-auto
basis-px

basis-1/2

basis-1/3
basis-2/3

basis-1/4
basis-3/4

basis-1/5
basis-4/5

basis-1/6
basis-5/6

basis-1/12
basis-11/12

basis-full

## Flex Direction

フレックス項目の方向を設定します。

flex-row
flex-row-reverse

flex-col
flex-col-reverse

## Flex Wrap

フレックスアイテムのラップ方法を作成します。

flex-nowrap
flex-wrap
flex-wrap-reverse

## Flex

フレックス項目がどのように拡大および縮小するかを制御します。

flex-1
flex-auto
flex-initial
flex-none

## Flex Grow

フレックス項目がどのように成長するかを制御します。

grow
grow-0

## Flex Shrink

フレックスアイテムがどのように縮小するかを制御します。

shrink
shrink-0

## Order

### Grid Template Columns

grid-cols-1
grid-cols-12

grid-cols-none

## Grid Column, start/end

グリッド項目のサイズとグリッド列内の位置を設定します。

col-auto

col-span-1
col-span-12

col-start-1
col-start-13

col-start-auto

col-end-1
col-end-13

col-end-auto

## Grid Template Rows

グリッドレイアウトの行を定義します。

grid-rows-1
grid-rows-6

grid-rows-none

## Grid Row, start/end

グリッド項目のサイズとグリッド行内の位置を設定します。

row-auto

row-span-1
row-span-6

row-start-1
row-start-7

row-start-auto

row-end-1
row-end-7

row-end-auto

## Grid Auto Flow

グリッド要素の自動配置を制御します。

grid-flow-row
grid-flow-col

grid-flow-row-dense
grid-flow-col-dense

## Grid Auto Columns

暗黙的に作成されるグリッド列のサイズを制御するユーティリティ。

auto-cols-auto
auto-cols-min
auto-cols-max
auto-cols-fr

## Grid Auto Rows

暗黙的に作成されるグリッド行のサイズを制御するユーティリティ。

auto-rows-auto
auto-rows-min
auto-rows-max
auto-rows-fr

## Gap

行と列の間にギャップ（余白）を設定します。

gap-0
gap-96

gap-x-0
gap-x-96

gap-y-0
gap-y-96

## Justify Content

コンテナの主軸に沿ってフレックス項目とグリッド項目を配置する方法を制御するユーティリティ。

justify-start
justify-center
justify-end
justify-between
justify-around
justify-evenly

## Justify Items

グリッド項目をインライン軸に沿って配置する方法を制御するユーティリティ。

justify-items-stretch
justify-items-start
justify-items-center
justify-items-end

## Justify Self

個々のグリッド項目をインライン軸に沿って配置する方法を制御するユーティリティ。

justify-self-stretch
justify-self-start
justify-self-center
justify-self-end
justify-self-auto

## Align Content

複数行のフレックス コンテナーおよびグリッド コンテナー内で行を配置する方法を制御するユーティリティ。

content-start
content-center
content-end
content-between
content-around
content-evenly

## Align Items

コンテナの交差軸に沿ってフレックス項目の位置を設定します。

items-stretch
items-start
items-center
items-end
items-baseline

## Align Self

個々のフレックス項目をコンテナーの交差軸に沿って配置する方法を制御します。

self-auto
self-start
self-center
self-end
self-stretch
self-baseline

## Place Content

コンテンツをどのように位置調整し、同時に配置するかを制御するためのユーティリティ。

place-content-start
place-content-center
place-content-end
place-content-between
place-content-around
place-content-evenly
place-content-stretch

## Place Items

項目の位置揃えと整列を同時に行う方法を制御するユーティリティ。

place-items-stretch
place-items-start
place-items-center
place-items-end

## Place Self

個々のアイテムの位置揃えと整列を同時に行う方法を制御するユーティリティ。

place-self-auto
place-self-start
place-self-center
place-self-end
place-self-stretch

----------------------------------------

# Sizing

## Width

w-0
w-96
w-auto

w-1/2

w-1/3
w-2/3

w-1/4
w-3/4

w-1/5
w-4/5

w-1/6
w-5/6

w-1/12
w-11/12

w-full
w-screen
w-min
w-max
w-fit

## Min Width

要素の最小幅を設定します。

min-w-0
min-w-full
min-w-min
min-w-max
min-w-fit

## Max Width
## Height

h-0
h-96
h-auto

h-1/2

h-1/3
h-2/3

h-1/4
h-3/4

h-1/5
h-4/5

h-1/6
h-5/6
h-full
h-screen
h-min
h-max
h-fit

## Min Height

要素の最小の高さを設定します。

min-h-0
min-h-full
min-h-screen
min-h-min
min-h-max
min-h-fit

## Max Height

要素の最大高さを設定します。

max-h-0
max-h-96

max-h-full
max-h-screen
max-h-min
max-h-max
max-h-fit

----------------------------------------

# Backgrounds

## Background Attachment

スクロール時の背景画像の動作を設定します。

bg-fixed
bg-local
bg-scroll

## Background Clip

要素の背景の境界ボックスを制御するためのユーティリティの動作を設定します。

bg-clip-border
bg-clip-padding
bg-clip-content
bg-clip-text

## Background Color

背景色を設定します。

bg-transparent
bg-current

bg-black
bg-white

bg-色-数字

## Background Opacity

背景の不透明度を設定します。

bg-opacity-0
bg-opacity-100

## Background Origin

要素の背景を境界線、パディング、コンテンツに対してどのように配置するかを制御するユーティリティ。

bg-origin-border
bg-origin-padding
bg-origin-content

## Background Position

背景画像の位置を設定します。

bg-bottom
bg-center
bg-left
bg-left-bottom
bg-left-top
bg-right
bg-right-bottom
bg-right-top
bg-top

## Background Repeat

背景画像の繰り返しを設定します。

bg-repeat
bg-no-repeat
bg-repeat-x
bg-repeat-y
bg-repeat-round
bg-repeat-space

## Background Size

背景画像の背景サイズを設定します。

bg-auto
bg-cover
bg-contain

## Background Image

要素の背景画像を制御するためのユーティリティ。

bg-none
bg-gradient-to-t
bg-gradient-to-tr

bg-gradient-to-r

bg-gradient-to-br
bg-gradient-to-b
bg-gradient-to-bl

bg-gradient-to-l
bg-gradient-to-tl

## Gradient Color Stops

背景のグラデーションのカラーストップを制御するユーティリティ。

from-transparent
from-current
from-black
from-white

from-色-数字

via-transparent
via-current
via-black
via-white

via-色-数字

to-transparent
to-current
to-black
to-white

to-色-数字

----------------------------------------

# Transforms

## Scale

変換が適用された要素をスケールします。

scale-0
scale-150

scale-x-0
scale-x-150

scale-y-0
scale-y-150

## Rotate

変換が適用された要素を回転します。

rotate-0
rotate-180

## Translate

変換が適用された要素を変換します。

translate-x-0
translate-x-96

translate-x-1/2

translate-x-1/3
translate-x-2/3

translate-x-1/4
translate-x-3/4

translate-x-full

translate-y-0
translate-y-96

translate-y-1/2

translate-y-1/3
translate-y-2/3

translate-y-1/4
translate-y-3/4

translate-y-full

## Skew

変換が適用された要素を傾けます。

skew-x-0
skew-x-12

skew-y-0
skew-y-12

## Transform Origin

要素の変換の原点を設定します。原点は、要素の指定された位置に画鋲を押し込むことと考えてください。

origin-center
origin-top
origin-top-right
origin-right
origin-bottom-right
origin-bottom
origin-bottom-left
origin-left
origin-top-left

----------------------------------------

# SVG

## Fill

SVG 要素の塗りつぶしをスタイル設定するためのユーティリティ。

fill-current

## Stroke

SVG 要素のストロークをスタイル設定するためのユーティリティ。

stroke-current

## Stroke Width

SVG 要素のストローク幅をスタイル設定するためのユーティリティ。

stroke-0
stroke-2

----------------------------------------

# Effects

## Box Shadow

shadow-xs
shadow-sm
shadow
shadow-md
shadow-lg

shadow-xl
shadow-2xl

shadow-inner
shadow-outline
shadow-none

## Opacity

opacity-0
opacity-100

## Mix Blend Mode

要素が背景とどのようにブレンドされるかを制御するユーティリティ。

mix-blend-normal
mix-blend-multiply
mix-blend-screen
mix-blend-overlay
mix-blend-darken
mix-blend-lighten
mix-blend-color-dodge
mix-blend-color-burn
mix-blend-hard-light
mix-blend-soft-light
mix-blend-difference
mix-blend-exclusion
mix-blend-hue
mix-blend-saturation
mix-blend-color
mix-blend-luminosity

## Background Blend Mode

要素の背景画像と背景色をどのようにブレンドするかを制御するユーティリティ。

bg-blend-normal
bg-blend-multiply
bg-blend-screen
bg-blend-overlay
bg-blend-darken
bg-blend-lighten
bg-blend-color-dodge
bg-blend-color-burn
bg-blend-hard-light
bg-blend-soft-light
bg-blend-difference
bg-blend-exclusion
bg-blend-hue
bg-blend-saturation
bg-blend-color
bg-blend-luminosity

----------------------------------------

# Accessibility

## Screen Readers

スクリーン リーダーによるアクセシビリティを向上させるためのユーティリティ。

sr-only
not-sr-only

----------------------------------------

# Spacing

## Padding

パディングを 0.25rem 単位で制御します。

p-0
p-96

py-0
py-96

pt-0
pr-0
pb-0
pl-0

pt-96
pr-96
pb-96
pl-96

## Margin

マージン (および負のマージン) を 0.25rem 単位で制御します。

m-0
m-96

my-0
mx-0

my-96
mx-96

mt-0
mr-0
mb-0
ml-0

mt-96
mr-96
mb-96
ml-96

-m-0
-m-96

-my-0
-mx-0

-my-96
-mx-96

-mt-0
-mr-0
-mb-0
-ml-0

-mt-96
-mr-96
-mb-96
-ml-96

## Space Between

子要素間の余白を制御します

space-x-0
space-x-96
space-x-px

-space-x-0
-space-x-96
-space-x-px

space-y-0
space-y-96
space-y-px

-space-y-0
-space-y-96
-space-y-px

space-x-reverse
space-y-reverse

----------------------------------------

# Borders

## Border Radius

境界線の半径を設定します。

rounded-none
rounded-sm

rounded
rounded-md
rounded-lg

rounded-xl
rounded-3xl

rounded-full

rounded-t-none
rounded-r-none
rounded-b-none
rounded-l-none

rounded-t-sm
rounded-r-sm
rounded-b-sm
rounded-l-sm

rounded-t
rounded-r
rounded-b
rounded-l

rounded-t-md
rounded-r-md
rounded-b-md
rounded-l-md

rounded-t-lg
rounded-r-lg
rounded-b-lg
rounded-l-lg

rounded-t-xl
rounded-r-xl
rounded-b-xl
rounded-l-xl
rounded-t-3xl
rounded-r-3xl
rounded-b-3xl
rounded-l-3xl

rounded-t-full
rounded-r-full
rounded-b-full
rounded-l-full

rounded-tl-none
rounded-tr-none
rounded-br-none
rounded-bl-none

rounded-tl-sm
rounded-tr-sm
rounded-br-sm
rounded-bl-sm

rounded-tl
rounded-tr
rounded-br
rounded-bl

rounded-tl-md
rounded-tr-md
rounded-br-md
rounded-bl-md

rounded-tl-lg
rounded-tr-lg
rounded-br-lg
rounded-bl-lg

rounded-tl-xl
rounded-tr-xl
rounded-br-xl
rounded-bl-xl
rounded-tl-3xl
rounded-tr-3xl
rounded-br-3xl
rounded-bl-3xl

rounded-tl-full
rounded-tr-full
rounded-br-full
rounded-bl-full

## Border Width

境界線の幅を 1px 単位で設定します。

border
border-0
border-8

border-t
border-t-0
border-t-8

border-r
border-r-0
border-r-8

border-b
border-b-0
border-b-8

border-l
border-l-0
border-l-8

## Border Color

境界線の色を設定します。

border-transparent
border-current
border-black
border-white

border-色-数字

## Border Opacity

境界線の不透明度を設定します。

border-opacity-0
border-opacity-100

## Border Style

境界線のスタイルを設定します。

border-solid
border-dashed
border-dotted
border-double
border-hidden
border-none

## Divide Width

要素間の境界線の幅を制御します。

divide-x-0
divide-x-8
divide-x

divide-y-0
divide-y-8
divide-y

divide-x-reverse
divide-y-reverse

## Divide Color

要素間の境界線の色を制御します。

divide-transparent
divide-current
divide-black
divide-white

divide-色-数字

## Divide Opacity

要素間の境界の不透明度を制御します。

divide-opacity-0
divide-opacity-100

## Divide Style

分割のスタイルを設定します。

divide-solid
divide-dashed
divide-dotted
divide-double
divide-none

## Outline Width

要素のアウトラインの幅を制御するユーティリティ。

outline-0
outline-8

## Outline Style

要素のアウトラインのスタイルを制御するユーティリティ。

outline
outline-dashed
outline-dotted
outline-double
outline-none

## Outline Offset

要素のアウトラインのオフセットを制御するユーティリティ。

outline-offset-0
outline-offset-8

## Ring Width

ボックスシャドウを使用してアウトラインリングを作成するためのユーティリティ。

ring-0
ring-8

ring
ring-inset

## Ring Color

アウトラインリングの色を設定するためのユーティリティ。

ring-transparent
ring-current
ring-black
ring-white

ring-色-数字

## Ring Opacity

アウトラインリングの不透明度を設定するユーティリティ。

ring-opacity-0
ring-opacity-100

## Ring Offset Width

アウトライン リングを追加するときにオフセットをシミュレートするユーティリティ。

ring-offset-0
ring-offset-8


## Ring Offset Color

アウトラインリングのオフセットの色を設定するユーティリティ。

ring-offset-transparent
ring-offset-current
ring-offset-black
ring-offset-white
ring-offset-色-数字

----------------------------------------

# Typography

## Font Family

フォントファミリーを設定します。

font-sans
font-serif
font-mono

## Font Size

フォントサイズを設定します。

text-xs
text-sm
text-base
text-lg
text-xl
text-9xl


## Font Smoothing

antialiased
subpixel-antialiased

## Font Style

italic
not-italic

## Font Weight

フォントの太さを設定します。

font-thin
font-extralight
font-light
font-normal
font-medium
font-semibold
font-bold
font-extrabold
font-black

## Font Variant Numeric

数値のバリアントを制御するためのユーティリティ。

normal-nums
ordinal
slashed-zero
lining-nums
oldstyle-nums
proportional-nums
tabular-nums
diagonal-fractions
stacked-fractions

## Letter Spacing

文字間の間隔を設定します。

tracking-tighter
tracking-tight
tracking-normal
tracking-wide
tracking-wider
tracking-widest

## Line Height

行の高さを設定します。

leading-none
leading-tight
leading-snug
leading-normal
leading-relaxed
leading-loose
leading-3
leading-4
leading-5
leading-6
leading-7
leading-8
leading-9
leading-10

## List Style Type

リストの箇条書きスタイルを設定します。

list-none
list-disc
list-decimal

## List Style Position

リストの箇条書きの位置を設定します。

list-inside
list-outside

## Text Align

テキストの配置を設定します。

text-left
text-center
text-right
text-justify

## Text Color

文字の色を設定します。

text-transparent
text-current
text-black
text-white

text-色-数字


## Text Decoration

テキストの装飾を制御するためのユーティリティ。

underline
overline
line-through
no-underline

## Text Decoration Style

テキスト装飾のスタイルを制御するためのユーティリティ。

decoration-solid
decoration-double
decoration-dotted
decoration-dashed
decoration-wavy

## Text Decoration Thickness

テキスト装飾の太さを制御するユーティリティ。

decoration-auto
decoration-from-font

decoration-0
decoration-8

## Text Underline Offset

テキストの下線のオフセットを制御するユーティリティ。

underline-offset-auto
underline-offset-from-font

underline-offset-0
underline-offset-8

## Text Transform

テキストの変換を制御するユーティリティ。

uppercase
lowercase
capitalize
normal-case

## Text Overflow

要素内のテキストのオーバーフローを制御するユーティリティ。

truncate
text-ellipsis
text-clip

## Text Indent

ブロック内のテキストの前に表示される空きスペースの量を制御するユーティリティ。

indent-0
indent-96

indent-px

## Vertical Align

インラインまたはテーブルセルボックスの垂直方向の配置を設定します。

align-baseline
align-top

align-middle
align-bottom

align-text-top
align-text-bottom

align-sub
align-super

## White Space

要素の空白を設定します。

whitespace-normal
whitespace-nowrap
whitespace-pre
whitespace-pre-line
whitespace-pre-wrap

## Word Break

要素の単語区切りを設定します。

break-normal
break-words
break-all

## Content

前後の疑似要素の内容を制御するためのユーティリティ。

content-none

----------------------------------------

# Transitions & Animation

## Transition Property

トランジションアニメーションの影響を受ける CSS プロパティを設定します。

transition
transition-none
transition-all
transition-colors
transition-opacity
transition-shadow
transition-transform

## Transition Duration

トランジション アニメーションが完了するまでの時間を設定します。

uration-75
duration-1000

## Transition Timing Function

トランジションアニメーションのイージング機能を設定します。

ease-linear
ease-in
ease-out
ease-in-out

## Transition Delay

遷移遅延の影響を受ける CSS プロパティを設定します。

delay-75
delay-1000

## Animation

CSS アニメーションを使用して要素をアニメーション化するためのユーティリティ。

animate-spin
animate-ping
animate-pulse
animate-bounce

----------------------------------------

# Interactivity

## Appearance

オペレーティング システムのテーマに基づいたネイティブ スタイルを無効にします。

appearance-none

## Cursor

要素の上にマウスを置くとカーソルが変わります。

cursor-auto
cursor-default
cursor-pointer
cursor-wait
cursor-text
cursor-move
cursor-help
cursor-not-allowed
cursor-none
cursor-context-menu
cursor-progress
cursor-cell
cursor-crosshair
cursor-vertical-text
cursor-alias
cursor-copy
cursor-no-drop
cursor-grab
cursor-grabbing
cursor-all-scroll
cursor-col-resize
cursor-row-resize
cursor-n-resize
cursor-e-resize
cursor-s-resize
cursor-w-resize
cursor-ne-resize
cursor-nw-resize
cursor-se-resize
cursor-sw-resize
cursor-ew-resize
cursor-ns-resize
cursor-nesw-resize
cursor-nwse-resize
cursor-zoom-in
cursor-zoom-out

## Pointer Events

要素がマウス イベントのターゲットであるかどうかを指定します。

pointer-events-none
pointer-events-auto

## Resize

要素のサイズを変更できるかどうか、および方向を設定します。

resize-none
resize
resize-y
resize-x

## Scroll Behavior

要素のスクロール動作を制御するユーティリティ。

scroll-auto
scroll-smooth

## Scroll Margin

スナップ コンテナ内の項目の周囲のスクロール オフセットを制御するユーティリティ。

scroll-m-0
scroll-m-96

scroll-my-0
scroll-mx-0
scroll-my-96
scroll-mx-96

scroll-mt-0
scroll-mr-0
scroll-mb-0
scroll-ml-0
scroll-mt-96
scroll-mr-96
scroll-mb-96
scroll-ml-96

## Scroll Padding

スナップコンテナ内の要素のスクロールオフセットを制御するユーティリティ。

scroll-p-0
scroll-p-96

scroll-py-0
scroll-py-96

scroll-pt-0
scroll-pr-0
scroll-pb-0
scroll-pl-0
scroll-pt-96
scroll-pr-96
scroll-pb-96
scroll-pl-96

## Scroll Snap Align

要素のスクロール スナップの配置を制御するユーティリティ。
snap-start
snap-end
snap-center
snap-align-none

## Scroll Snap Stop

可能なスナップ位置を超えてスキップできるかどうかを制御するユーティリティ。
snap-normal
snap-always

## Scroll Snap Type

スナップ コンテナ内でスナップ ポイントをどの程度厳密に適用するかを制御するユーティリティ。

snap-none
snap-x
snap-y
snap-both
snap-mandatory
snap-proximity

## Touch Action

タッチスクリーン上で要素をスクロールおよびズームする方法を制御するユーティリティ。

touch-auto
touch-none
touch-pan-x
touch-pan-left
touch-pan-right
touch-pan-y
touch-pan-up
touch-pan-down
touch-pinch-zoom
touch-manipulation

## User Select

ユーザーがテキストを選択できるかどうかを制御します。

select-none
select-text
select-all
select-auto

## Will Change

変更が予想される要素の今後のアニメーションを最適化するためのユーティリティ。

will-change-auto
will-change-scroll
will-change-contents
will-change-transform

----------------------------------------

# Tables

## Border Collapse

テーブルの境界線を折りたたむか分離します。

border-collapse
border-separate

## Table Layout

テーブルのセル、行、列のレイアウトに使用されるアルゴリズムを定義します。

table-auto
table-fixed

----------------------------------------

# Filters

## Blur

要素にぼかしフィルターを適用するためのユーティリティ。

blur-none
blur-sm
blur
blur-md
blur-lg
blur-xl
blur-2xl
blur-3xl

## Brightness

要素に明るさフィルターを適用するためのユーティリティ。

brightness-0
brightness-200

## Contrast

要素にコントラスト フィルターを適用するためのユーティリティ。

contrast-0
contrast-200

## Drop Shadow

要素にドロップシャドウ フィルターを適用するためのユーティリティ。

drop-shadow-sm
drop-shadow
drop-shadow-md
drop-shadow-lg
drop-shadow-xl
drop-shadow-2xl
drop-shadow-none

## Grayscale

要素にグレースケール フィルターを適用するためのユーティリティ。

grayscale-0
grayscale

## Hue Rotate

色相回転フィルターを要素に適用するためのユーティリティ。

hue-rotate-0
hue-rotate-180

## Invert

要素に反転フィルターを適用するためのユーティリティ。

invert-0
invert

## Saturate

要素に彩度フィルターを適用するためのユーティリティ。

saturate-0
saturate-200

## Sepia

要素にセピア フィルターを適用するためのユーティリティ。

sepia-0
sepia

## Backdrop Blur

背景ぼかしフィルターを要素に適用するためのユーティリティ。

backdrop-blur-none
backdrop-blur-sm
backdrop-blur
backdrop-blur-md
backdrop-blur-lg
backdrop-blur-xl
backdrop-blur-2xl
backdrop-blur-3xl

## Backdrop Brightness

背景の明るさフィルターを要素に適用するためのユーティリティ。

backdrop-brightness-0
backdrop-brightness-sm
backdrop-brightness
backdrop-brightness-md
backdrop-brightness-lg
backdrop-brightness-xl
backdrop-brightness-3xl

## Backdrop Contrast

要素に背景コントラスト フィルターを適用するためのユーティリティ。

backdrop-contrast-0
backdrop-contrast-200

## Backdrop Grayscale

背景グレースケール フィルターを要素に適用するためのユーティリティ。

backdrop-grayscale-0

backdrop-grayscale

## Backdrop Hue Rotate

背景の色相回転フィルターを要素に適用するためのユーティリティ。

backdrop-hue-rotate-0
backdrop-hue-rotate-180

## Backdrop Invert

背景反転フィルターを要素に適用するためのユーティリティ。

backdrop-invert-0
backdrop-invert

## Backdrop Opacity

背景の不透明度フィルターを要素に適用するためのユーティリティ。

backdrop-opacity-0
backdrop-opacity-100

## Backdrop Saturate

背景の彩度フィルターを要素に適用するためのユーティリティ。

backdrop-saturate-0
backdrop-saturate-200

## Backdrop Sepia

背景セピアフィルターを要素に適用するためのユーティリティ。

backdrop-sepia-0
backdrop-sepia

----------------------------------------