08.
Design System
Welcome to our test page for Employer Design System
Optimized Input Fields
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Inputs
Variações Inputs
Variações Small
Variações Small disabled
Variações Large
Variações Large disabled
Textarea
Form-Group
Variação 01
Variações de Cores
Variações Rounded
Variações Pill
Variação 02
Variações Rounded
Variação 03
Disabled
Variações Round
Variações Pill
Variações de cores
Variação 04
Tipos de Input
Checks
Optimized Input Checkbox enhance user experience with.
Default e Checked
Small e Large
Disabled
Indeterminate
Powerful for your Design Team
Typography establishes a clear hierarchy, guiding users effortlessly. Smaller H5 and H6 headings support the primary content, while Body 2 and Small Text provide additional details without distraction. Consistent Button Text styling ensures call-to-action elements are prominent and easy to interact with, creating a seamless and intuitive user experience.Typography establishes a clear hierarchy, guiding users effortlessly. Smaller H5 and H6 headings support the primary content, while Body 2 and Small Text provide additional details without distraction.
Primary Emphasis
Base Color Emphasis highlights primary design elements, ensuring they stand out for improved visual hierarchy.
Secondary Emphasis
Base Color Emphasis highlights primary design elements, ensuring they stand out for improved visual hierarchy.
Tertiary Emphasis
Base Color Emphasis highlights primary design elements, ensuring they stand out for improved visual hierarchy.
Quaternary Emphasis
Base Color Emphasis highlights primary design elements, ensuring they stand out for improved visual hierarchy.
Botões Redondos
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Botões Radius Pill
Botões Radius Pill
Botões Arredondados
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Botões Radius Round
Botões Radius Round
Botões Quadrados
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Botões Radius Straigh
Botões Radius Straigh
Botões Cores
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Botões Colors
Botões Colors
Hiperlinks
Optimized Input Fields enhance user experience with intuitive design, ensuring efficient and accurate data entry.
Typography: The Backbone of Good Design
Typography ensures consistent and readable text styling, enhancing the overall visual appeal and readability of the design.
Headline 01
Headline 02
Headline 03
Headline 04
Headline 05
Headline 06
Paragraph Large
Paragraph Medium
Paragraph Small
Paragraph XSmall
Badges
Badges provide clear and interactive elements for users to initiate actions, designed for usability and visual consistency within the interface.
Badge Small Outline/Disabled
Badge Medium Filled/Disabled
Badge Large Accent/Disabled
Badge XLarge Random/Disabled
Full Responsive and Dark & Light Mode Elements
Typography establishes a clear hierarchy, guiding users effortlessly. Smaller H5 and H6 headings support the primary content, while Body 2 and Small Text provide additional details without distraction. Consistent Button Text styling ensures call-to-action elements are prominent and easy to interact with, creating a seamless and intuitive user experience.Typography establishes a clear hierarchy, guiding users effortlessly. Smaller H5 and H6 headings support the primary content, while Body 2 and Small Text provide additional details without distraction.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
An Alert component is designed to immediately capture user attention and convey important information.
Transparent
Neutral
Accent
Semantic
Series
Emojis
Flags
Ícones
Página 1 de 1
Stores
Symbol
Drawer
Drawer
Grid
Spinner
Logos Tema White
Employer
Itau
Epays
Logos Tema Dark
Employer
Itau
Epays
