{"id":654,"date":"2021-03-21T11:45:15","date_gmt":"2021-03-21T11:45:15","guid":{"rendered":"https:\/\/infiniti7.com\/?p=654"},"modified":"2021-03-22T06:12:05","modified_gmt":"2021-03-22T06:12:05","slug":"top-10-react-js-ui-frameworks-in-2021","status":"publish","type":"post","link":"https:\/\/infiniti7.com\/top-10-react-js-ui-frameworks-in-2021\/","title":{"rendered":"Top 10 React JS UI Frameworks in 2021"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"654\" class=\"elementor elementor-654\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-10eb90b7 elementor-section-height-min-height elementor-section-content-middle elementor-reverse-mobile elementor-section-boxed elementor-section-height-default elementor-section-items-middle\" data-id=\"10eb90b7\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-58d7d74f\" data-id=\"58d7d74f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-a27bedf elementor-widget elementor-widget-text-editor\" data-id=\"a27bedf\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Published on 21st March 2021<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bd056cb elementor-widget elementor-widget-heading\" data-id=\"bd056cb\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Top 10 React JS UI Frameworks in 2021<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7ed0980f elementor-widget elementor-widget-text-editor\" data-id=\"7ed0980f\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Let&#8217;s look at the Top 10 React JS UI Frameworks in 2021. We have personally used these frameworks for our own projects and have ranked it in the order we prefer.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-31d75ac3\" data-id=\"31d75ac3\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6278ab69 elementor-widget elementor-widget-image\" data-id=\"6278ab69\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"380\" height=\"800\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/mobile-mockup-mithila.png\" class=\"attachment-full size-full wp-image-569\" alt=\"react native mobile app ecommerce\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/mobile-mockup-mithila.png 380w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/mobile-mockup-mithila-143x300.png 143w\" sizes=\"(max-width: 380px) 100vw, 380px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1a8593f5 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"1a8593f5\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-397f700a\" data-id=\"397f700a\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c03e019 elementor-widget elementor-widget-heading\" data-id=\"c03e019\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#1 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-12e231bc elementor-widget elementor-widget-heading\" data-id=\"12e231bc\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Ant Design - A UI Design Language and React UI Library.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6329a063 elementor-widget elementor-widget-text-editor\" data-id=\"6329a063\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>This is one of the best UI Libraries we&#8217;ve used since 2017 and this is our go to UI library when working on react projects.<\/p><p>\u00a0<\/p><p>It has lots of well designed and enterprise ready components and their documentation is great.<\/p><p>\u00a0<\/p><p>We recommend you definitely try Ant Design at-least once and experience its beauty yourself.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-05a221a ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"05a221a\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/ant-design\/ant-design\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/ant.design\/components\/overview\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-25d0b25c\" data-id=\"25d0b25c\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-10d63ad elementor-widget elementor-widget-image\" data-id=\"10d63ad\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-1024x768.png\" class=\"attachment-large size-large wp-image-703\" alt=\"Ant Design UI Framework React JS\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-ant-design-min-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e3a0b3c elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"e3a0b3c\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-df19802\" data-id=\"df19802\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b09e6b1 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"b09e6b1\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-54acc3f elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"54acc3f\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7a317f0\" data-id=\"7a317f0\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-182c306 elementor-widget elementor-widget-heading\" data-id=\"182c306\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#2 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8f858dd elementor-widget elementor-widget-heading\" data-id=\"8f858dd\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Material-UI - React components for faster and easier web development.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7b41bfd elementor-widget elementor-widget-text-editor\" data-id=\"7b41bfd\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Build your own design system, or start with Material Design.<\/p><p>\u00a0<\/p><p>It&#8217;s one of the best UI frameworks for Material Design. We have used it in several projects and definitely recommend you try Material UI once.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e5455a2 ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"e5455a2\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/mui-org\/material-ui\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/material-ui.com\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-84c86a3\" data-id=\"84c86a3\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cbd4a35 elementor-widget elementor-widget-image\" data-id=\"cbd4a35\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-1024x768.png\" class=\"attachment-large size-large wp-image-710\" alt=\"Material UI Framework React JS\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-material-ui-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-bb52080 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"bb52080\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3599ddc\" data-id=\"3599ddc\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-71bcaff elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"71bcaff\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-836ff43 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"836ff43\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-e1a90f2\" data-id=\"e1a90f2\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d31e196 elementor-widget elementor-widget-heading\" data-id=\"d31e196\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#3 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2709422 elementor-widget elementor-widget-heading\" data-id=\"2709422\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Fluent UI - Microsoft UI Kit for Web, Mobile & Desktop App Development.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3552c58 elementor-widget elementor-widget-text-editor\" data-id=\"3552c58\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>A collection of UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior.<\/p><p>\u00a0<\/p><p>Build for one platform or for all. Everything you need is here.<\/p><p>\u00a0<\/p><p>It looks great, has lots of components and if you&#8217;re building it for Windows users then this UI Kit will definitely help a lot.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c02d9da ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"c02d9da\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/microsoft\/fluentui\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/developer.microsoft.com\/en-us\/fluentui#\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-b6bacc8\" data-id=\"b6bacc8\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b223df8 elementor-widget elementor-widget-image\" data-id=\"b223df8\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-1024x768.png\" class=\"attachment-large size-large wp-image-721\" alt=\"React js ui library Fluent UI Kit\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-fluent-ui-min-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-736e5e0 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"736e5e0\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-7c6885e0\" data-id=\"7c6885e0\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-54327a2f elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"54327a2f\" data-element_type=\"section\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-48f8e026\" data-id=\"48f8e026\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4fa30a7e elementor-widget__width-auto elementor-widget elementor-widget-heading\" data-id=\"4fa30a7e\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h4 class=\"elementor-heading-title elementor-size-default\">React JS Development<\/h4>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4ef11ba9 elementor-widget__width-auto elementor-widget-tablet__width-initial elementor-widget elementor-widget-heading\" data-id=\"4ef11ba9\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<p class=\"elementor-heading-title elementor-size-default\">Looking for Experienced React JS Developers? Let's Connect Today!<\/p>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-342b4f9c\" data-id=\"342b4f9c\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b901ca7 elementor-align-right elementor-mobile-align-left elementor-widget elementor-widget-button\" data-id=\"b901ca7\" data-element_type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"\/contact-us\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-text\">Contact Us<\/span>\n\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1b78a57 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"1b78a57\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7fd4149\" data-id=\"7fd4149\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-9113afe elementor-widget elementor-widget-heading\" data-id=\"9113afe\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#4 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a351c29 elementor-widget elementor-widget-heading\" data-id=\"a351c29\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">React Bootstrap - Bootstrap components built with React.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-64e5b0a elementor-widget elementor-widget-text-editor\" data-id=\"64e5b0a\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>If you have used Bootstrap in the past then this will feel like home for you. You get the same components present in Bootstrap JS optimized for React JS.<\/p><p>\u00a0<\/p><p>We used it while migrating from a PHP app to React JS which had used Bootstrap JS as a UI Library.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a67250c ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"a67250c\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/react-bootstrap\/react-bootstrap\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/react-bootstrap.github.io\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-2a154dd\" data-id=\"2a154dd\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-453e759 elementor-widget elementor-widget-image\" data-id=\"453e759\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-1024x768.png\" class=\"attachment-large size-large wp-image-728\" alt=\"React Bootstrap UI Kit for React JS 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-react-bootstrap-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-44de897 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"44de897\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-6828bfe\" data-id=\"6828bfe\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-6b50188 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"6b50188\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-cdb511c elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"cdb511c\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-e023cab\" data-id=\"e023cab\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-0735185 elementor-widget elementor-widget-heading\" data-id=\"0735185\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#5 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eb52741 elementor-widget elementor-widget-heading\" data-id=\"eb52741\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">AtlasKit - Use Atlassian\u2019s end-to-end design language to create simple, intuitive and beautiful experiences.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-49d5454 elementor-widget elementor-widget-text-editor\" data-id=\"49d5454\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>If you are building any tools or integrations for Atlassian suite, This should be your goto UI framework.<\/p><p>\u00a0<\/p><p>It has lots of components and the UI matches Atlassian branding. We love how simple the UI and it&#8217;s very easy to use.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-899e425 ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"899e425\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/bitbucket.org\/atlassian\/atlassian-frontend-mirror\/src\/master\/\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-bitbucket\"><\/i>                    <\/span>\n                                                    <span >BitBucket<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/atlassian.design\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-95c154a\" data-id=\"95c154a\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-24849e7 elementor-widget elementor-widget-image\" data-id=\"24849e7\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-1024x768.png\" class=\"attachment-large size-large wp-image-733\" alt=\"Atlassian AtlasKit for React JS 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-atlaskit-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-eaca4db elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"eaca4db\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-ebbff4f\" data-id=\"ebbff4f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bba9217 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"bba9217\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-5c56024 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"5c56024\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-796d39d\" data-id=\"796d39d\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8f6d015 elementor-widget elementor-widget-heading\" data-id=\"8f6d015\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#6 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d34ed5 elementor-widget elementor-widget-heading\" data-id=\"5d34ed5\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Semantic UI React - The official Semantic-UI-React integration.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ed4d907 elementor-widget elementor-widget-text-editor\" data-id=\"ed4d907\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Semantic UI is a widely known and very popular UI framework and it has lots of good Components.<\/p><p>\u00a0<\/p><p>We have used it in the past for few of our projects and enjoyed working with this UI framework.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0ee2677 ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"0ee2677\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/Semantic-Org\/Semantic-UI-React\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/react.semantic-ui.com\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-998fa8f\" data-id=\"998fa8f\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-16ec5b0 elementor-widget elementor-widget-image\" data-id=\"16ec5b0\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-1024x768.png\" class=\"attachment-large size-large wp-image-738\" alt=\"Semantic UI - React JS UI Kit 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-semantic-ui-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f9a9af4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f9a9af4\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-83616db\" data-id=\"83616db\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-acea17a elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"acea17a\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6bc8f20 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"6bc8f20\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-91f3c07\" data-id=\"91f3c07\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-113193d elementor-widget elementor-widget-heading\" data-id=\"113193d\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#7 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ddd2c8b elementor-widget elementor-widget-heading\" data-id=\"ddd2c8b\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Blueprint - A React-based UI toolkit for the web.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7ce9e96 elementor-widget elementor-widget-text-editor\" data-id=\"7ce9e96\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>This used to be one of my favorite UI framework in the past. Good components and very easy to use.<\/p><p>\u00a0<\/p><p>It has some unique components, Do git this UI framework a try and check if its suitable for your requirements.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1721956 ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"1721956\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/palantir\/blueprint\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/blueprintjs.com\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-4d57704\" data-id=\"4d57704\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b74cb9d elementor-widget elementor-widget-image\" data-id=\"b74cb9d\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-1024x768.png\" class=\"attachment-large size-large wp-image-743\" alt=\"Blueprint - React JS UI Framework 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-blueprint-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7ddccac elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"7ddccac\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d99d754\" data-id=\"d99d754\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-558369e elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"558369e\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d54413a elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"d54413a\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-880c201\" data-id=\"880c201\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b85f1fc elementor-widget elementor-widget-heading\" data-id=\"b85f1fc\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#8 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f186058 elementor-widget elementor-widget-heading\" data-id=\"f186058\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Grommet - build responsive and accessible mobile-first projects for the web with an easy to use component library.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-267278d elementor-widget elementor-widget-text-editor\" data-id=\"267278d\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>A react-based framework that provides accessibility, modularity, responsiveness, and theming in a tidy package.<\/p><p>\u00a0<\/p><p>It doesn&#8217;t have many components when compared with other UI Frameworks, But the components it has are really polished and you get a visual Grommet Designer and Grommet Themer.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ec21167 ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"ec21167\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/grommet\/grommet\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/v2.grommet.io\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7145017\" data-id=\"7145017\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-046292a elementor-widget elementor-widget-image\" data-id=\"046292a\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-1024x768.png\" class=\"attachment-large size-large wp-image-747\" alt=\"React JS UI Framework grommet\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-grommet-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-abdb226 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"abdb226\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-963df53\" data-id=\"963df53\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-f3661d9 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"f3661d9\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-bd9d591 elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"bd9d591\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-3fe3588\" data-id=\"3fe3588\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5f09e3b elementor-widget elementor-widget-heading\" data-id=\"5f09e3b\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#9 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f739432 elementor-widget elementor-widget-heading\" data-id=\"f739432\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Onsen UI - The most beautiful and efficient way to develop HTML5 hybrid and mobile web apps.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6b241b8 elementor-widget elementor-widget-text-editor\" data-id=\"6b241b8\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.<\/p><p>\u00a0<\/p><p>If you plan on building a Hybrid application using React JS, This should be your goto UI Framework.<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-67e45df ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"67e45df\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/OnsenUI\/OnsenUI\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/onsen.io\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-e980edc\" data-id=\"e980edc\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-212b815 elementor-widget elementor-widget-image\" data-id=\"212b815\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-1024x768.png\" class=\"attachment-large size-large wp-image-752\" alt=\"Onsen UI - Top UI Framework for React JS 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-onsen-ui-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6ab22eb elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"6ab22eb\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-1d4900a\" data-id=\"1d4900a\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-e42c212 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"e42c212\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-316cf1b elementor-section-content-middle elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"316cf1b\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-b1f02b1\" data-id=\"b1f02b1\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2b100d5 elementor-widget elementor-widget-heading\" data-id=\"2b100d5\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">#10 UI Framework<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7d394bc elementor-widget elementor-widget-heading\" data-id=\"7d394bc\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h5 class=\"elementor-heading-title elementor-size-default\">Rebass - React primitive UI components built with styled-system.<\/h5>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fcda175 elementor-widget elementor-widget-text-editor\" data-id=\"fcda175\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<ul><li>Start your design system without boiling the ocean<\/li><li>Build consistent UI with design constraints and user-defined scales<\/li><li>Best-in-class developer ergonomics with\u00a0<a href=\"https:\/\/styled-system.com\/\" rel=\"nofollow noopener\" target=\"_blank\">Styled System<\/a>\u00a0props<\/li><li>First-class support for theming &amp; fully compatible with\u00a0<a href=\"https:\/\/theme-ui.com\/\" rel=\"nofollow noopener\" target=\"_blank\">Theme UI<\/a><\/li><li>Quick, mobile-first responsive styles with array-based syntax<\/li><li>Flexbox layout with the Box and Flex components<\/li><li>Flexibility built in for high design &amp; development velocity<\/li><li>Minimal footprint at about 4KB<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5a85d1b ha-dual-button--layout-queue ha-dual-button--tablet-layout-queue ha-dual-button--mobile-layout-queue elementor-widget elementor-widget-ha-dual-button happy-addon ha-dual-button\" data-id=\"5a85d1b\" data-element_type=\"widget\" data-widget_type=\"ha-dual-button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--left\" href=\"https:\/\/github.com\/rebassjs\/rebass\" target=\"_blank\" rel=\"noopener\">\n                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--before\">\n                        <i aria-hidden=\"true\" class=\"fab fa-github\"><\/i>                    <\/span>\n                                                    <span >GitHub<\/span>\n                                            <\/a>\n                            <span class=\"ha-dual-btn-connector ha-dual-btn-connector--text\">\n                    &amp;                <\/span>\n                    <\/div>\n        <div class=\"ha-dual-btn-wrapper\">\n            <a class=\"ha-dual-btn ha-dual-btn--right\" href=\"https:\/\/rebassjs.org\/\" target=\"_blank\" rel=\"noopener\">\n                                                    <span >Website<\/span>\n                                                    <span class=\"ha-dual-btn-icon ha-dual-btn-icon--after\">\n                        <i aria-hidden=\"true\" class=\"hm hm-link\"><\/i>                    <\/span>\n                            <\/a>\n        <\/div>\n        \t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-8a47ae5\" data-id=\"8a47ae5\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-7f207f5 elementor-widget elementor-widget-image\" data-id=\"7f207f5\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"768\" src=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-1024x768.png\" class=\"attachment-large size-large wp-image-757\" alt=\"Rebass react js ui framework 2021\" srcset=\"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-1024x768.png 1024w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-300x225.png 300w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-768x576.png 768w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-1536x1152.png 1536w, https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-ui-2021-rebass-ui-2048x1536.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Published on 21st March 2021 Top 10 React JS UI Frameworks in 2021 Let&#8217;s look at the Top 10 React JS UI Frameworks in 2021. We have personally used these frameworks for our own projects and have ranked it in the order we prefer. #1 UI Framework Ant Design &#8211; A UI Design Language and [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":667,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"ocean_post_layout":"","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"0","ocean_second_sidebar":"0","ocean_disable_margins":"enable","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"default","ocean_display_header":"default","ocean_header_style":"","ocean_center_header_left_menu":"0","ocean_custom_header_template":"0","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"0","ocean_menu_typo_font_family":"0","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"default","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"default","ocean_display_footer_bottom":"default","ocean_custom_footer_template":"0","ocean_post_oembed":"","ocean_post_self_hosted_media":"","ocean_post_video_embed":"","ocean_link_format":"","ocean_link_format_target":"self","ocean_quote_format":"","ocean_quote_format_link":"post","ocean_gallery_link_images":"off","ocean_gallery_id":[],"footnotes":""},"categories":[1],"tags":[],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/infiniti7.com\/wp-content\/uploads\/2021\/03\/react-js-ui-libraries.jpg","_links":{"self":[{"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/posts\/654"}],"collection":[{"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/comments?post=654"}],"version-history":[{"count":0,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/posts\/654\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/media\/667"}],"wp:attachment":[{"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/media?parent=654"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/categories?post=654"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/infiniti7.com\/wp-json\/wp\/v2\/tags?post=654"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}