Lexicon
LexiconLexicon
v 2.0v 1.0
  • Get Started
  • Foundations
    • Animations
    • Color
    • Grid
    • Layout
      • Full Box
      • Cards Layout
      • Form Box
      • Sidebar + Box
    • Typography
    • Writing Style
  • Core Components
    • Actions Definition
    • Alerts
    • Badges
    • Buttons
    • Cards
    • Charts
      • Charts
      • Colors
      • Interaction
      • Bar Chart
      • Donut Chart
      • Heatmap Chart
      • Line Chart
      • Pie Chart
      • Predictive Forecast Chart
      • Stacked Bar Chart
    • Confirmation Message
    • Dataset Display
    • Drag and Drop
    • Dropdown Menu
    • Empty States
    • Forms
      • Forms
      • Forms Hierarchy
      • Forms Navigation
      • Forms Rules
      • Forms Validation
      • Checkbox, Radio, Toggle
      • Color Picker
      • Date & Time Pickers
      • Multi Step Form
      • Multi Step Form Simplified
      • Selectors
      • Slider
      • Text Input
      • Text Input Group
      • Text Input Localizable
      • Text Input Variations
    • Icons
    • Labels
    • Link
    • List
    • Loading Indicator
    • Modals
    • Navigation
      • Breadcrumb
      • Navbar
      • Vertical Navigation
    • Pagination
    • Popovers and Tooltips
    • Progress Bar
    • Sidebar
    • Stickers
    • Table
      • Table
      • Inline Edit Table
    • Tabs
    • Toolbars
      • Toolbar
      • Management Toolbar
      • Upper Toolbar
  • Satellite Components
    • File Upload
    • Image Selector
    • Miller Columns
    • Navigation
      • Navigation
      • Header
    • Sidebar
      • Info Panel
      • Product Menu
    • Sites
      • Sites
      • Asset Title Bar
      • Asset Toolbar
      • Buttons
      • Profile Info
      • Widget Title Bar
  • Templates
    • Dataset Template
    • Form Template
  • Examples
    • Asset Metrics Dashboard
    • Page Distribution
    • Partner Portal
  • News
    • News
    • Status
  • Resources

Form Box

The basic layout used to contain form structures built based on 8/12 grid columns.

The Form Box is the most basic layout used to contain form structures. This layout is composed of a box that occupies 8 columns of the grid, with 2 offset columns on both sides.

layout form box 1440px width screen

Responsive behavior

Note that the form box layout changes from 8 to 12 columns on viewports that are equal to or less than 768px, in order to optimize space for content.

layout form box responsive summary

Attributes

layout form box metrics

Example

layout form box example

Except as otherwise noted, the content of this site is licensed under CC BY-SA 4.0 license.