package tw

  1. Overview
  2. Docs
package tw
Legend:
Page
Library
Module
Module type
Parameter
Class
Class type
Source

Module Tw.SizingSource

Sizing utilities for width and height

https://tailwindcss.com/docs/width https://tailwindcss.com/docs/height https://tailwindcss.com/docs/min-width https://tailwindcss.com/docs/max-width https://tailwindcss.com/docs/min-height https://tailwindcss.com/docs/max-height https://tailwindcss.com/docs/aspect-ratio

Sourcetype size = [
  1. | `None
  2. | `Xs
  3. | `Sm
  4. | `Md
  5. | `Lg
  6. | `Xl
  7. | `Xl_2
  8. | `Xl_3
  9. | `Full
  10. | `Rem of float
]
Sourceval order : Utility.base -> (int * int) option

order u returns the priority and suborder for sizing utilities.

Width Utilities

Sourceval w' : size -> Utility.t

w' sz sets width to predefined size sz (e.g., `Sm, `Full).

Sourceval w : int -> Utility.t

w n sets width using spacing scale (n * 0.25rem).

Sourceval w_auto : Utility.t

w_auto sets width to auto.

Sourceval w_full : Utility.t

w_full sets width to 100%.

Sourceval w_screen : Utility.t

w_screen sets width to 100vw.

Sourceval w_min : Utility.t

w_min sets width to min-content.

Sourceval w_max : Utility.t

w_max sets width to max-content.

Sourceval w_fit : Utility.t

w_fit sets width to fit-content.

Sourceval w_1_2 : Utility.t

w_1_2 sets width to 1/2.

Sourceval w_1_3 : Utility.t

w_1_3 sets width to 1/3.

Sourceval w_2_3 : Utility.t

w_2_3 sets width to 2/3.

Sourceval w_1_4 : Utility.t

w_1_4 sets width to 1/4.

Sourceval w_3_4 : Utility.t

w_3_4 sets width to 3/4.

Sourceval w_1_5 : Utility.t

w_1_5 sets width to 1/5.

Sourceval w_2_5 : Utility.t

w_2_5 sets width to 2/5.

Sourceval w_3_5 : Utility.t

w_3_5 sets width to 3/5.

Sourceval w_4_5 : Utility.t

w_4_5 sets width to 4/5.

Sourceval h' : size -> Utility.t

h' sz sets height to predefined size sz.

Sourceval h : int -> Utility.t

h n sets height using spacing scale (n * 0.25rem).

Sourceval h_auto : Utility.t

h_auto sets height to auto.

Sourceval h_full : Utility.t

h_full sets height to 100%.

Sourceval h_screen : Utility.t

h_screen sets height to 100vh.

Sourceval h_min : Utility.t

h_min sets height to min-content.

Sourceval h_max : Utility.t

h_max sets height to max-content.

Sourceval h_fit : Utility.t

h_fit sets height to fit-content.

Sourceval h_1_2 : Utility.t

h_1_2 sets height to 1/2.

Sourceval h_1_3 : Utility.t

h_1_3 sets height to 1/3.

Sourceval h_2_3 : Utility.t

h_2_3 sets height to 2/3.

Sourceval h_1_4 : Utility.t

h_1_4 sets height to 1/4.

Sourceval h_3_4 : Utility.t

h_3_4 sets height to 3/4.

Sourceval h_1_5 : Utility.t

h_1_5 sets height to 1/5.

Sourceval h_2_5 : Utility.t

h_2_5 sets height to 2/5.

Sourceval h_3_5 : Utility.t

h_3_5 sets height to 3/5.

Sourceval h_4_5 : Utility.t

h_4_5 sets height to 4/5.

Sourceval min_w' : size -> Utility.t

min_w' sz sets min-width to predefined size sz.

Sourceval min_w : int -> Utility.t

min_w n sets min-width using spacing scale.

Sourceval min_w_0 : Utility.t

min_w_0 sets min-width to 0.

Sourceval min_w_full : Utility.t

min_w_full sets min-width to 100%.

Sourceval min_w_min : Utility.t

min_w_min sets min-width to min-content.

Sourceval min_w_max : Utility.t

min_w_max sets min-width to max-content.

Sourceval min_w_fit : Utility.t

min_w_fit sets min-width to fit-content.

Sourceval max_w' : size -> Utility.t

max_w' sz sets max-width to predefined size sz.

Sourceval max_w : int -> Utility.t

max_w n sets max-width using spacing scale.

Sourceval max_w_none : Utility.t

max_w_none removes the max-width constraint.

Sourceval max_w_xs : Utility.t

max_w_xs sets max-width to xs container width.

Sourceval max_w_sm : Utility.t

max_w_sm sets max-width to sm container width.

Sourceval max_w_md : Utility.t

max_w_md sets max-width to md container width.

Sourceval max_w_lg : Utility.t

max_w_lg sets max-width to lg container width.

Sourceval max_w_xl : Utility.t

max_w_xl sets max-width to xl container width.

Sourceval max_w_2xl : Utility.t

max_w_2xl sets max-width to 2xl container width.

Sourceval max_w_3xl : Utility.t

max_w_3xl sets max-width to 3xl container width.

Sourceval max_w_4xl : Utility.t

max_w_4xl sets max-width to 4xl container width.

Sourceval max_w_5xl : Utility.t

max_w_5xl sets max-width to 5xl container width.

Sourceval max_w_6xl : Utility.t

max_w_6xl sets max-width to 6xl container width.

Sourceval max_w_7xl : Utility.t

max_w_7xl sets max-width to 7xl container width.

Sourceval max_w_full : Utility.t

max_w_full sets max-width to 100%.

Sourceval max_w_min : Utility.t

max_w_min sets max-width to min-content.

Sourceval max_w_max : Utility.t

max_w_max sets max-width to max-content.

Sourceval max_w_fit : Utility.t

max_w_fit sets max-width to fit-content.

Sourceval max_w_prose : Utility.t

max_w_prose sets max-width to a readable measure for prose.

Sourceval max_w_screen_sm : Utility.t

max_w_screen_sm sets max-width to small breakpoint width.

Sourceval max_w_screen_md : Utility.t

max_w_screen_md sets max-width to medium breakpoint width.

Sourceval max_w_screen_lg : Utility.t

max_w_screen_lg sets max-width to large breakpoint width.

Sourceval max_w_screen_xl : Utility.t

max_w_screen_xl sets max-width to extra-large breakpoint width.

Sourceval max_w_screen_2xl : Utility.t

max_w_screen_2xl sets max-width to 2× extra-large breakpoint width.

Sourceval min_h' : size -> Utility.t

min_h' sz sets min-height to predefined size sz.

Sourceval min_h : int -> Utility.t

min_h n sets min-height using spacing scale.

Sourceval min_h_0 : Utility.t

min_h_0 sets min-height to 0.

Sourceval min_h_full : Utility.t

min_h_full sets min-height to 100%.

Sourceval min_h_screen : Utility.t

min_h_screen sets min-height to 100vh.

Sourceval min_h_min : Utility.t

min_h_min sets min-height to min-content.

Sourceval min_h_max : Utility.t

min_h_max sets min-height to max-content.

Sourceval min_h_fit : Utility.t

min_h_fit sets min-height to fit-content.

Sourceval max_h' : size -> Utility.t

max_h' sz sets max-height to predefined size sz.

Sourceval max_h : int -> Utility.t

max_h n sets max-height using spacing scale.

Sourceval max_h_none : Utility.t

max_h_none removes the max-height constraint.

Sourceval max_h_full : Utility.t

max_h_full sets max-height to 100%.

Sourceval max_h_screen : Utility.t

max_h_screen sets max-height to 100vh.

Sourceval max_h_min : Utility.t

max_h_min sets max-height to min-content.

Sourceval max_h_max : Utility.t

max_h_max sets max-height to max-content.

Sourceval max_h_fit : Utility.t

max_h_fit sets max-height to fit-content.

Size Utilities (Width and Height Combined)

Sourceval size : int -> Utility.t

size n sets both width and height using spacing scale (n * 0.25rem). Equivalent to combining w n and h n.

Sourceval size_auto : Utility.t

size_auto sets both width and height to auto.

Sourceval size_full : Utility.t

size_full sets both width and height to 100%.

Sourceval size_min : Utility.t

size_min sets both width and height to min-content.

Sourceval size_max : Utility.t

size_max sets both width and height to max-content.

Sourceval size_fit : Utility.t

size_fit sets both width and height to fit-content.

Aspect Ratio Utilities

Sourceval aspect_auto : Utility.t

aspect_auto removes any aspect ratio constraint.

Sourceval aspect_square : Utility.t

aspect_square sets aspect ratio to 1:1.

Sourceval aspect_video : Utility.t

aspect_video sets aspect ratio to 16:9.

Sourceval aspect_ratio : int -> int -> Utility.t

aspect_ratio w h creates a custom aspect ratio with width w and height h.

suborder core returns the suborder for a sizing utility class name. Heights come before widths, with numeric values sorted numerically.

Container Theme Variables

container_3xs is the theme variable for 3xs container width (16rem).

container_2xs is the theme variable for 2xs container width (18rem).

container_xs is the theme variable for xs container width (20rem).

container_sm is the theme variable for sm container width (24rem).

container_md is the theme variable for md container width (28rem).

container_lg is the theme variable for lg container width (32rem).

container_xl is the theme variable for xl container width (36rem).

container_2xl is the theme variable for 2xl container width (42rem).

container_3xl is the theme variable for 3xl container width (48rem).

container_4xl is the theme variable for 4xl container width (56rem).

container_5xl is the theme variable for 5xl container width (64rem).

container_6xl is the theme variable for 6xl container width (72rem).

container_7xl is the theme variable for 7xl container width (80rem).