Pages
Introduction Colors & Tokens Icons
UI
Button Link Badge Notification Badge Alert Card Spinner Avatar Divider Empty State
Interactive
Modal Side Modal Dropdown Tooltip Accordion Tabs Flash Toast
Forms
Form Select Toggle Checkbox & Radio Text Fields Date & Time Fields
Layout
Navbar Sidebar Table Pagination Breadcrumbs Selector List
Utilities
Local Time

Text Fields

app_theme_text_field_tag for tag-style forms; inside app_theme_form_with every standard builder field is styled automatically.

Tag helper

.demo-stack
  = app_theme_text_field_tag :name, nil, placeholder: "Plain text field"
  = app_theme_text_field_tag :email, nil, type: :email, placeholder: "Email"
  = app_theme_text_field_tag :password, nil, type: :password, placeholder: "Password"
  = app_theme_text_field_tag :disabled_field, "Disabled", disabled: true

Builder fields

= app_theme_form_with(scope: :profile, url: "#") do |f|
  .demo-stack
    = f.text_field :name, placeholder: "text_field"
    = f.number_field :age, placeholder: "number_field"
    = f.search_field :query, placeholder: "search_field"
    = f.date_field :birthday
    = f.text_area :bio, placeholder: "text_area", rows: 3