Visual Components

Since Lowcoder Version 2.4.0, you can use more than 120 Components, so you can build stunning Applications and Web Integrations.

These components share a number of common settings and configurations.

We are proud to share that we also have unmatched, deep styling capabilities, so most of the components offer you a truly high degree of customization in all aspects of the component.

• Colors

• Font-Stying

• Borders

• Backgrounds & Gradients

• Shadows

• Rotation

• Animation

Dashboards & Reporting

Chart (legacy)

A versatile component for visualizing data through various types of charts and graphs.

Basic Chart

A versatile component for visualizing data through various types of charts and graphs.

Candlestick Chart

A style of financial chart used to describe price movements of a security, derivative, or currency.

Funnel Chart

A visualization tool for displaying the progressive reduction of data as it passes through stages.

Gauge Chart

A chart that displays data as a reading on a dial, useful for indicating the status or level of something.

Graph Chart

A diagram representing a network of nodes connected by edges, useful for showing interconnections and relationships.

Heatmap Chart

A graphical representation of data where individual values are represented as colors.

Radar Chart

A graphical method of displaying multivariate data in the form of a two-dimensional chart of three or more quantitative variables.

Sankey Chart

A flow diagram in which the width of the arrows is proportional to the flow rate, used to show energy, material, or cost transfers.

Sunburst Chart

A radial space-filling visualization technique that illustrates hierarchical relationships through layers of a circle.

Theme River Chart

A visualization resembling a stream graph that shows changes in a data set over time across categories.

Tree Chart

A diagram that visually represents hierarchy in a tree-like structure, showing relationships among various nodes.

Treemap Chart

A chart that uses nested rectangles to represent hierarchical data proportionately.

Openlayers Geomap

A component for displaying interactive maps using OpenLayers, with support for various map layers and features.

Geo Map Charts

A component for visualizing geographical data on interactive maps with dynamic charts.

Table

A rich table component for displaying data in a structured table format, with options for sorting and filtering, tree Data display and extensible Rows.

Pivot Table

A data summarization and analysis tool for organizing and aggregating data in a tabular format.

Mermaid Chart

A component for rendering complex diagrams and flowcharts based on Mermaid syntax.

Timeline

A component for displaying events or actions in a chronological order, visually represented along a linear timeline.

Progress

A visual indicator of progress, typically used to show the completion status of a task.

Progress Circle

A circular progress indicator, often used for loading states or time-bound tasks.

Shapes

A collection of geometric shapes for use with diagrams, illustrations, and visualizations.

Text Display

A simple component for displaying static or dynamic text content inclusive Markdown formatting.

Layout & Navigation

Responsive Layout

A layout component designed to adapt and respond to different screen sizes and devices, ensuring a consistent user experience.

Page Layout Container

A container which offers to create a layout with header, sider, footer and main content areas.

Column Layout

A layout component designed to adapt and respond to different screen sizes and devices, ensuring a consistent user experience.

Float Text Container

Float Text Container component.

Content Card

A card component for displaying organized information or content in a structured manner.

Tabbed Container

A container with tabbed navigation for organizing content into separate panels.

Collapsible Container

A container that can be expanded or collapsed, ideal for managing content visibility.

Container

A general-purpose container for layout and organization of UI elements.

List View

A component for displaying a list of items or data, where you can place other components inside. Like a repeater.

Grid

A flexible grid component for creating structured layouts with rows and columns as an extension to the List View component.

Modal

A pop-up modal component for displaying content, alerts, or forms in focus.

Drawer

A sliding panel component that can be used for additional navigation or content display, typically emerging from the edge of the screen.

Divider

A visual divider component, used to separate content or sections in a layout.

Navigation

A navigation component for creating menus, breadcrumbs, or tabs for site navigation.

Step Control

A control with step options to offer visual guided steps for applications like forms or wizards.

Cascader

A multi-level dropdown for hierarchical data selection, such as selecting a location.

Link

A hyperlink display component for navigation or linking to external resources.

Float Button

A floating action button for prominent and quick actions.

Tree

A tree structure component for displaying hierarchical data, such as file systems or organizational charts.

Tree Select

A selection component that presents options in a hierarchical tree format, allowing for organized and nested selections.

Text Display

A simple component for displaying static or dynamic text content inclusive Markdown formatting.

Data Collection & Forms

Form

A container component for building structured forms with various input types.

JSON Schema Form

A dynamic form component generated based on a JSON schema.

JSON Editor

An editor component for creating and modifying JSON data with validation and syntax highlighting.

JSON Explorer

A component for visually exploring and interacting with JSON data structures.

Rich Text Editor

An advanced text editor supporting rich formatting options like bold, italics, and lists.

Input

A basic text input field allowing users to enter and edit text.

Password

A secure field for password input, masking the characters for privacy.

Number Input

A field specifically for numerical input, with controls for incrementing and decrementing values.

Text Area

A multi-line text input for longer form content, such as comments or descriptions.

Auto Complete

An input field that provides suggestions as you type, enhancing user experience and accuracy.

Switch

A toggle switch for on/off or yes/no type decisions.

Checkbox

A standard checkbox for options that can be selected or deselected.

Radio

Radio buttons for selecting one option from a set, where only one choice is allowed.

Date

A date picker component for selecting dates from a calendar interface.

Date Range

A component for selecting a range of dates, useful for booking systems or filters.

Time

A time selection component for choosing specific times of the day.

Time Range

A component for selecting a range of time, often used in scheduling applications.

Slider

A graphical slider component for selecting a value or range within a defined scale.

Range Slider

A dual-handle slider to select a range of values, useful for filtering or setting limits.

Form Button

A versatile button component for submitting forms, triggering actions, or navigating.

Icon Button

A button for controlling functions like start, end, mute, or share.

Dropdown

A dropdown menu for compactly displaying a list of options.

Toggle Button

A button that can toggle between two states or options.

Segmented Control

A control with segmented options for quickly toggling between multiple choices.

Rating

A component for capturing user ratings, displayed as stars.

Select

A dropdown menu for selecting from a list of options.

Multiselect

A component that allows selection of multiple items from a dropdown list.

Meetings & Collaboration

Screen Share Stream

Access and Displays the Stream of shared Screens in the Browser.

Camera Stream

Access and Displays the Stream of the Camera of the current User and Attendees.

Agora Meeting Controller

Meeting Component to manage and secure a Meeting Room.

Avatar

Displays user avatars or profile images for personalized identification.

Avatar Group

A group of avatars to represent multiple users or entities in a compact and visually appealing way.

Comment

A component for adding and displaying user comments, supporting threaded replies and user interaction.

Mention

A component that supports mentioning users or tags within text content, typically used in social media or collaborative platforms.

Icon Button

A button for controlling functions like start, end, mute, or share.

Project Management

Calendar

A calendar component for displaying dates and events, with options for month, week, or day views.

Timer

A component that displays a countdown or elapsed time, useful for tracking durations and deadlines.

Gantt Chart

A chart that illustrates a project schedule, showing the start and finish dates of elements and dependencies.

Hillchart

A visualization component for displaying project management state data in a hill chart format.

BPMN Editor

A component for viewing, creating and editing BPMN diagrams, supporting various BPMN elements and features.

Progress

A visual indicator of progress, typically used to show the completion status of a task.

Progress Circle

A circular progress indicator, often used for loading states or time-bound tasks.

Timeline

A component for displaying events or actions in a chronological order, visually represented along a linear timeline.

Calendar & Scheduling

Calendar

A calendar component for displaying dates and events, with options for month, week, or day views.

Timer

A component that displays a countdown or elapsed time, useful for tracking durations and deadlines.

Date

A date picker component for selecting dates from a calendar interface.

Date Range

A component for selecting a range of dates, useful for booking systems or filters.

Time

A time selection component for choosing specific times of the day.

Time Range

A component for selecting a range of time, often used in scheduling applications.

Document & File Management

BPMN Editor

A component for viewing, creating and editing BPMN diagrams, supporting various BPMN elements and features.

File Upload

A component for uploading files, with support for drag-and-drop and file selection.

File Viewer

A component for viewing various types of files, including documents and images.

QR Code

A component for displaying QR codes, useful for quick scanning and information transfer.

Tree

A tree structure component for displaying hierarchical data, such as file systems or organizational charts.

Tree Select

A selection component that presents options in a hierarchical tree format, allowing for organized and nested selections.

Transfer

Facilitates data transfer between two lists with drag-and-drop functionality.

Item & Signature Handling

QR Code

A component for displaying QR codes, useful for quick scanning and information transfer.

Scanner

A component for scanning barcodes, QR codes, and other similar data.

Signature

A component for capturing digital signatures, useful for approvals and verification processes.

Select

A dropdown menu for selecting from a list of options.

Multiselect

A component that allows selection of multiple items from a dropdown list.

Tour

A product tour for guiding users.

Tree

A tree structure component for displaying hierarchical data, such as file systems or organizational charts.

Tree Select

A selection component that presents options in a hierarchical tree format, allowing for organized and nested selections.

Transfer

Facilitates data transfer between two lists with drag-and-drop functionality.

Turnstile Captcha

A captcha component to verify users against bots.

Multimedia

Image

A component for displaying images, supporting various formats based on URI or Base64 Data.

Image Carousel

A rotating carousel component for showcasing images, banners, or content slides.

Audio

A component for embedding audio content, with controls for playback and volume adjustment.

Video

A multimedia component for embedding and playing video content, with support for various formats.

Shapes

A collection of geometric shapes for use with diagrams, illustrations, and visualizations.

Image Editor

An interactive component for editing and manipulating images, offering various tools and filters.

Color Picker

Intuitive color selection for customization.

Tour

A product tour for guiding users.

Text Display

A simple component for displaying static or dynamic text content inclusive Markdown formatting.

Icon

Use various Icons to enhance the visual appeal and user experience of your application.

JSON Lottie

A component for displaying Lottie animations, providing lightweight and scalable animations based on JSON data.

Integration & Extension

IFrame

An inline frame component for embedding external web pages and apps or content within the application.

Custom Component

A flexible, programmable component for creating unique, user-defined UI elements tailored to your specific needs.