Hi Components Library

Speed up the development time for your apps by finding here solutions to increase their quality and range of available features.

Integrate these components in your apps and use their customisation options.

Different components available, to help you in different situations or open more opportunities in your applications development.

Check the available components list and their description:

• Hi Actions Container (R) 
  Display large amounts of content with the possibility to include actions in it.
• Hi Actions Container (T) 
  Display large amounts of content with the possibility to include actions in it.
• Hi Advanced File Upload (R)
  Component used to insert or drag and drop a file.
• Hi Advanced Info Overlay (R)
  Full card overlay for additional content on the entire card.
• Hi Advanced Search (R)
  Allow the user to have multiple types of search inputs.
• Hi Advanced Search (T)
  Allow the user to have multiple types of search inputs.
• Hi Advanced Timeline (R)
  Have a timeline displayed vertically and with several options to show in how to have content displayed or hidden.
• Hi Arc Chart (T)
  Allow you to use a list of arc-chart type to create a chart.
• Hi Auto-Resize Text Area (R)
  Component to make the Text Area to expand when content is added.
• Hi Auto-Resize Text Area (T)
  Component to make the Text Area to expand when content is added.
• Hi Body Class (R) 
  Use it to insert classes on the html body (Add, Remove and Toggle actions).
• Hi Bulk Select (T)
  Use it to select/unselect all checkboxes inside a Table Records widget.
  
• Hi Button Option (R)
  Display one or more options inside a button.
• Hi Card Center Row Content (T)
  Show content in the center row, plus the choice of having other content or actions in the left and/or right side of the card.
• Hi Card Swiper (R) 
  Component with a slideshow card swiper and 3D effect.
• Hi Card With Progress (R) 
  Have a card with different text placeholders and a progress bar.
• Hi Circular Slider (T)
  Create a circular slider by giving a list of items and an initial value for the slider.
• Hi Color Preview (R) 
  Have a container that changes its background color.
• Hi Color Preview (T) 
  Have a container that changes its background color.
• Hi Confetti (R) 
  Component to drop confetti on your screen.
• Hi Confirmation Delete (R) 
  Have a confirmation step that can be used to verify danger actions, like delete or other type of exclude data.
• Hi Confirmation Delete (T) 
  Have a confirmation step that can be used to verify danger actions, like delete or other type of exclude data.
• Hi Content Flow Steps (T) 
  Component used to display content in a step way and to create a flow of steps.
• Hi Copy to Clipboard (R) 
  Component used to copy and or cut text to clipboard.
• Hi Country Code (T)
  Have a dropdown with a flag and international country code to be selected.
• Hi Credit Card (R)
  Show a card with information such as number or name of the holder and have the option to change the card's background image.
• Hi Credit Card (T)
  Show a card with information such as number or name of the holder and have the option to change the card's background image.
• Hi Cupertino Pane (R)
  Slide-over pane with touch technologies.
• Hi Custom Button Loading (R)
  Button with a loading state.
• Hi Custom Dropdown Search (R)
  Enhanced dropdown block, with a search functionality.
• Hi Custom Popover (R)
  Display additional content on user selection.
• Hi Custom Section Index (R)
  Use it to enable the users to navigate within a page quickly.
• Hi Dropdown Search Inline (R)
  Display a dropdown with a search functionality.
• Hi Element Scroll (T)
  Component used to create a vertical scroll for content.
• Hi Error Screen (R) 
  Display on the screen the type of a page error.
• Hi Error Screen (T) 
  Display on the screen the type of a page error.
• Hi Expandable Table Row (R) 
  Expand and collapse a row with content between table rows.
• Hi Flex (R)
  The Flexible Box Layout Module makes it easier to display flexible and responsive elements without using float or positioning.
• Hi Font Awesome Free (T)
  Use it to preview and insert the attributes of Font Awesome Free icons.
• Hi Font Awesome Icon (R)
  Use it to preview or insert a Font Awesome icon.
• Hi Font Awesome Icon (T) 
  Use it to preview or insert a Font Awesome icon in Traditional applications.
• Hi Full Page Overlay (R) 
  Have a full page overlay for additional content on the entire screen.
• Hi HTML Editor (R) 
  Next generation block styled editor.
• Hi Icon SVG (R) 
  Display and create icons SVG from HTML tags.
• Hi Iframe (R) 
  Display the content of an URL.
• Hi Image Background (R)
  Have a banner with custom content. Areas without content or having images without background will have a filled background with a color of your choice.
• Hi Image Cropper (R) 
  Component that gives the user a selection of image cropping possibilities.
• Hi Increment Input (R) 
  Input with actions to change the numeric value (- 1), (+ 1) or in a different interval.
• Hi Increment Input (T) 
  Input with actions to change the numeric value (- 1), (+ 1) or in a different interval.
• Hi Input Code (R)
  Have a styled input that can force number or password type.
• Hi Input Code (T)
  Have a styled input that can force number or password type.
• Hi Input Color (R) 
  Have an input color type, where the user can insert different color type codes.
• Hi Input Color (T) 
  Have an input color type, where the user can insert different color type codes.
• Hi Input Label (R) 
  Display a label and its widget.
• Hi Input Label (T) 
  Display a label and its widget.
• Hi Input Mask Currency (R)
  Apply a mask on currency input fields.
• Hi Input Month/Year Mask (R)
  Applies a mask to the input with a format MM/YYYY.
• Hi Input Month/Year Mask (T)
  Applies a mask to the input with a format MM/YYYY.
• Hi Input Progress (R)
  Component to display an input progress regarding its expected value length.
• Hi Loading Animation (R)
  Component to display a loading state.
• Hi Loading Animation (T)
  Component to display a loading state.
• Hi Loading for Splash Screen (R)
  Splash loading component is used to do the splash screen when you start or open your application.
• Hi Masonry Gallery (R)
  Display content in a masonry like pattern.
• Hi Multi Detail Card (R)
  Display different information type in a card with several content areas.
• Hi Multi Select Dropdown (R)
  Have a dropdown with a multiple choices selection from several options.
• Hi Multi Select Dropdown (T)
  Have a dropdown with a multiple choices selection from several options.
• Hi Multiple Detail Card (R)
  Use it to display as many info in your card as you want.
• Hi Native Range Slider (R)
  The input type "range" defines a control for entering a number whose exact value is not important (like a slider control).
• Hi Notifications Popover (R)
  A popover to display notifications.
• Hi Offset Menu (R)
  Use the Hi Offset Menu to add a different menu to your app.
• Hi Opacity Effect (R)
  Component to add an opacity effect to all its content.
• Hi Opacity Effect (T)
  Component to add an opacity effect to all its content.
• Hi Pagination Show Items (R)
  Help users to find a specific listed item by having a different number of items per page choice to select.
• Hi Parallax Mouse (R)
  Component that allows to add items that move at a different speed depending on the mouse movement.
• Hi Parallax Scroll (R)
  Component that allows you to add items that move at a different speed depending on the scroll.
• Hi Popover Filter (T)
  Component having a popover that can be used to display a filter triggered by clicking on a button included in the component.
• Hi Popup Structure (R)
  Use this to have display a popup having a title, a secondary content (like for example, a checkbox) and an actions area at the bottom.
• Hi Progress Scroll (R)
  Hi ProgressScroll is a minimalist page scroll indicator to visualize the scroll position (how much the user has scrolled) in a slim progress bar. Fully customizable via CSS.
• Hi QR Coder (R)
  A simple QR Code generator to your application.
• Hi Remove Tag (R)
  Use it to select and remove tags.
• Hi Responsive Breadcrumbs (R)
  Display the current user location in applications with a deep page hierarchy.
• Hi Ring Progress (R)
  Component to display an element surrounded by a ring with a progress.
• Hi Ring Progress (T)
  Component to display an element surrounded by a ring with a progress.
• Hi Section Actions (R)
  Use it to separate content and you can include in it actions.
• Hi Section Content Expandable (R)
  Useful component to organize information by displaying part of the content first and then expand it to see more.
• Hi Select Card (R)
  Allow the user to select cards between multiple options.
• Hi Select Card (T)
  Allow the user to select cards between multiple options.
• Hi Responsive Breadcrumbs (T)
  Display the current user location in applications with a deep page hierarchy.
• Hi Select Option Group (T)
  Use it in a dropdown so you can select an option with options separated by groups.
• Hi Select Tag (R)
  Component to select multiple options displayed as tag elements.
• Hi Side Actions (R)
  Have a button icon with an action that when pressed, floats additional actions to a different choice of positions.
• Hi Simple Pagination (R)
  Display the pagination in a different layout for its options and results.
• Hi Sticky Content (T)
  Component to add a bottom area on your screen used to compare items.
• Hi Swipe Up Card (R)
  Swipe up a card in you mobile app.
• Hi Table Edit Inline (R)
  Allow the user to easily edit, add or delete content inline on a table.
• Hi Table Row Expandable (R)
  Allow the user to create and display expandable content inside the table.
• Hi Table Row Expandable (T)
  Allow the user to create and display expandable content inside the table.
• Hi Timer Carousel (R)
  Have a carousel with multiple items and a visible timer in an horizontal slide.
• Hi Title Line Separator (R)
  Use this to show a text with separator, so it helps you to organise and structure better your content.
• Hi Tooltip Container (R)
  Display a tooltip on a card, input or other pattern type.
• Hi Transfer List (R)
  Component with a double column transfer choice box which allows the user to move a single or multiple items between two select items.
• Hi Two Columns Same Height (T)
  Display columns with the same height. You can also set different widths for the first column and different gap sizes.
• Hi UI Range Slider (T)
  Allow the user to select a single value between two range values.
• Hi Undo Action (R)
  Undo Action causes an action to be "triggered" just after a few seconds, giving the user an opportunity to cancel that selected action.
• Hi Upload File Size (R)
  Actions to return a file size in bytes that allows you to validate a certain file size uploaded through the uploaded widget before send it to the server.
• Hi User Info Popover (R)
  Have a popover to display the user info.
  
• Hi Users List (R)
  Have the option to reverse a previous action.
• Hi Users List (T)
  Have the option to reverse a previous action.
• Hi Visibility (R)
  Component to toggle an element visibility. Hidden elements take up space on your screen.
• Hi Zip Code Mask (R)
  Insert a zip code number and it will be inserted dynamically by having its first and second part separated.
  
  

(R) Reactive component
(T) Traditional component

• Select the component you need for your application.
• Add it to your screen. 
• Check its customisation options and if available, edit or add the content you need.