{"id":1343,"date":"2024-04-21T09:59:38","date_gmt":"2024-04-21T08:59:38","guid":{"rendered":"https:\/\/amit.onobit.com\/?page_id=1343"},"modified":"2024-04-23T07:35:00","modified_gmt":"2024-04-23T06:35:00","slug":"atomic-design-system","status":"publish","type":"page","link":"https:\/\/amit.onobit.com\/?page_id=1343","title":{"rendered":"Atomic Design System"},"content":{"rendered":"<style>.elementor-1343 .elementor-element.elementor-element-65987ee{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-413f8b2 .elementor-button{font-family:\"Poppins\", Sans-serif;font-size:18px;font-weight:500;fill:#27A468;color:#27A468;background-color:#EAF8F1;border-style:none;border-radius:100px 100px 100px 100px;}.elementor-1343 .elementor-element.elementor-element-413f8b2 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-413f8b2.elementor-element{--order:99999 \/* order end hack *\/;}.elementor-1343 .elementor-element.elementor-element-94c6196 .elementor-button{font-family:\"Poppins\", Sans-serif;font-size:18px;font-weight:500;fill:#F2A735;color:#F2A735;background-color:#FCF5EB;border-style:none;border-radius:100px 100px 100px 100px;}.elementor-1343 .elementor-element.elementor-element-94c6196 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-94c6196.elementor-element{--order:99999 \/* order end hack *\/;}.elementor-1343 .elementor-element.elementor-element-6588a4a .elementor-button{font-family:\"Poppins\", Sans-serif;font-size:18px;font-weight:500;fill:#FF4C4C;color:#FF4C4C;background-color:#FFE7E7;border-style:none;border-radius:100px 100px 100px 100px;}.elementor-1343 .elementor-element.elementor-element-6588a4a > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-6588a4a.elementor-element{--order:99999 \/* order end hack *\/;}.elementor-1343 .elementor-element.elementor-element-69352a0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--gap:0px 0px;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-69352a0.elementor-element.e-flex::before{content:\"\";width:100%;height:100%;position:absolute;left:0;top:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);border-radius:inherit;background-color:inherit;}.elementor-1343 .elementor-element.elementor-element-ec7188f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-ec7188f.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1343 .elementor-element.elementor-element-9e7ba43{text-align:left;}.elementor-1343 .elementor-element.elementor-element-9e7ba43 img{width:45%;}.elementor-1343 .elementor-element.elementor-element-0326cf3{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-1343 .elementor-element.elementor-element-0326cf3 .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-303ad48{text-align:left;}.elementor-1343 .elementor-element.elementor-element-303ad48 .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:55px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-303ad48 > .elementor-widget-container{margin:-29px 0px -11px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-60001f9{text-align:left;color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:20px;font-weight:500;}.elementor-1343 .elementor-element.elementor-element-96fd02a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-2303adc img{width:100%;}.elementor-1343 .elementor-element.elementor-element-3b38e02{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-2b22457{--divider-border-style:solid;--divider-color:#000;--divider-border-width:0px;}.elementor-1343 .elementor-element.elementor-element-2b22457 .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-2b22457 .elementor-divider{padding-block-start:20px;padding-block-end:20px;}.elementor-1343 .elementor-element.elementor-element-de95719{text-align:left;}.elementor-1343 .elementor-element.elementor-element-de95719 .elementor-heading-title{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-de95719 > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-d4dafc4{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-ddd9cec img{width:100%;}.elementor-1343 .elementor-element.elementor-element-470fb3d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-0b5b81b{--divider-border-style:solid;--divider-color:#000;--divider-border-width:0px;}.elementor-1343 .elementor-element.elementor-element-0b5b81b .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-0b5b81b .elementor-divider{padding-block-start:20px;padding-block-end:20px;}.elementor-1343 .elementor-element.elementor-element-4faa8a0{text-align:left;}.elementor-1343 .elementor-element.elementor-element-4faa8a0 .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-4faa8a0 > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-1ab0e4b{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-1ab0e4b > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-3ef1ce2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-89600d7 img{width:100%;}.elementor-1343 .elementor-element.elementor-element-47981ae{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-a2acc32{--divider-border-style:solid;--divider-color:#000;--divider-border-width:0px;}.elementor-1343 .elementor-element.elementor-element-a2acc32 .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-a2acc32 .elementor-divider{padding-block-start:20px;padding-block-end:20px;}.elementor-1343 .elementor-element.elementor-element-1905edf{text-align:left;}.elementor-1343 .elementor-element.elementor-element-1905edf .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-1905edf > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-ecfd8bc{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--gap:0px 0px;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-38da5c4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-827b010{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-827b010 > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-ac772cf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-a9437e3{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-a9437e3 > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-d6f6d22{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-04970f8 img{width:100%;}.elementor-1343 .elementor-element.elementor-element-fa61743 img{width:100%;}.elementor-1343 .elementor-element.elementor-element-805ab20 img{width:100%;}.elementor-1343 .elementor-element.elementor-element-fa2b713{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-38541ef{--divider-border-style:solid;--divider-color:#000;--divider-border-width:0px;}.elementor-1343 .elementor-element.elementor-element-38541ef .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-38541ef .elementor-divider{padding-block-start:20px;padding-block-end:20px;}.elementor-1343 .elementor-element.elementor-element-78f4497{text-align:left;}.elementor-1343 .elementor-element.elementor-element-78f4497 .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-78f4497 > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-fdc9bdd{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-fdc9bdd > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-7d00d93{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-de25141 img{width:100%;}.elementor-1343 .elementor-element.elementor-element-bc67924{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-3b718b5{--divider-border-style:solid;--divider-color:#000;--divider-border-width:0px;}.elementor-1343 .elementor-element.elementor-element-3b718b5 .elementor-divider-separator{width:0%;}.elementor-1343 .elementor-element.elementor-element-3b718b5 .elementor-divider{padding-block-start:20px;padding-block-end:20px;}.elementor-1343 .elementor-element.elementor-element-57e05ba{text-align:left;}.elementor-1343 .elementor-element.elementor-element-57e05ba .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-57e05ba > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-11be94f{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-11be94f > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-41c9229{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-5c1d46f img{width:100%;}.elementor-1343 .elementor-element.elementor-element-44cb2fd{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--gap:0px 0px;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-ce6d89a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-ce6d89a.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1343 .elementor-element.elementor-element-9f0f042{text-align:left;}.elementor-1343 .elementor-element.elementor-element-9f0f042 .elementor-heading-title{color:#3A3D3B;font-family:\"Poppins\", Sans-serif;font-size:30px;font-weight:600;line-height:90px;}.elementor-1343 .elementor-element.elementor-element-9f0f042 > .elementor-widget-container{margin:-30px 0px -30px 0px;padding:0px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-287a02f{color:#3A3D3B;font-family:\"Roboto\", Sans-serif;font-size:18px;font-weight:400;}.elementor-1343 .elementor-element.elementor-element-287a02f > .elementor-widget-container{margin:0px 0px -13px 0px;}.elementor-1343 .elementor-element.elementor-element-7d7c879{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--background-transition:0.3s;}.elementor-1343 .elementor-element.elementor-element-1d44fc9 img{width:50%;}@media(max-width:1024px){.elementor-1343 .elementor-element.elementor-element-303ad48 .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-de95719 .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-4faa8a0 .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-1905edf .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-78f4497 .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-57e05ba .elementor-heading-title{line-height:77px;}.elementor-1343 .elementor-element.elementor-element-9f0f042 .elementor-heading-title{line-height:77px;}}@media(min-width:768px){.elementor-1343 .elementor-element.elementor-element-65987ee{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-69352a0{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-ec7188f{--width:91.461%;}.elementor-1343 .elementor-element.elementor-element-96fd02a{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-3b38e02{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-470fb3d{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-3ef1ce2{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-47981ae{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-ecfd8bc{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-38da5c4{--width:50%;}.elementor-1343 .elementor-element.elementor-element-ac772cf{--width:50%;}.elementor-1343 .elementor-element.elementor-element-d6f6d22{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-fa2b713{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-7d00d93{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-bc67924{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-41c9229{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-44cb2fd{--content-width:85%;}.elementor-1343 .elementor-element.elementor-element-ce6d89a{--width:68.39%;}.elementor-1343 .elementor-element.elementor-element-7d7c879{--width:66.6666%;}}@media(max-width:767px){.elementor-1343 .elementor-element.elementor-element-65987ee{--margin-block-start:0px;--margin-block-end:12px;--margin-inline-start:0px;--margin-inline-end:0px;}.elementor-1343 .elementor-element.elementor-element-413f8b2 .elementor-button{font-size:12px;}.elementor-1343 .elementor-element.elementor-element-94c6196 .elementor-button{font-size:12px;}.elementor-1343 .elementor-element.elementor-element-6588a4a .elementor-button{font-size:12px;}.elementor-1343 .elementor-element.elementor-element-9e7ba43 img{width:80%;}.elementor-1343 .elementor-element.elementor-element-303ad48 .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-60001f9{font-size:16px;}.elementor-1343 .elementor-element.elementor-element-de95719 .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-d4dafc4 > .elementor-widget-container{margin:10px 0px 0px 0px;}.elementor-1343 .elementor-element.elementor-element-4faa8a0 .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-1905edf .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-78f4497 .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-57e05ba .elementor-heading-title{font-size:6.8vw;line-height:40px;}.elementor-1343 .elementor-element.elementor-element-9f0f042 .elementor-heading-title{font-size:6.8vw;line-height:40px;}}<\/style>\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1343\" class=\"elementor elementor-1343\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-65987ee e-flex e-con-boxed elementor-invisible e-con e-parent\" data-id=\"65987ee\" data-element_type=\"container\" data-settings=\"{&quot;animation&quot;:&quot;fadeInUp&quot;,&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-413f8b2 elementor-widget elementor-widget-button\" data-id=\"413f8b2\" 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-size-xs\" role=\"button\">\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\">Design System<\/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<div class=\"elementor-element elementor-element-94c6196 elementor-widget elementor-widget-button\" data-id=\"94c6196\" 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-size-xs\" role=\"button\">\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\">Web<\/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<div class=\"elementor-element elementor-element-6588a4a elementor-widget elementor-widget-button\" data-id=\"6588a4a\" 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-size-xs\" role=\"button\">\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\">2022<\/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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-69352a0 e-flex e-con-boxed elementor-invisible e-con e-parent\" data-id=\"69352a0\" data-element_type=\"container\" data-settings=\"{&quot;animation&quot;:&quot;fadeInUp&quot;,&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ec7188f e-con-full e-flex e-con e-child\" data-id=\"ec7188f\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e7ba43 elementor-widget elementor-widget-image\" data-id=\"9e7ba43\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.19.0 - 07-02-2024 *\/\n.elementor-widget-image{text-align:center}.elementor-widget-image a{display:inline-block}.elementor-widget-image a img[src$=\".svg\"]{width:48px}.elementor-widget-image img{vertical-align:middle;display:inline-block}<\/style>\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"69\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Logo-1.png\" class=\"attachment-large size-large wp-image-1346\" alt=\"\" \/>\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<div class=\"elementor-element elementor-element-0326cf3 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"0326cf3\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.19.0 - 07-02-2024 *\/\n.elementor-widget-divider{--divider-border-style:none;--divider-border-width:1px;--divider-color:#0c0d0e;--divider-icon-size:20px;--divider-element-spacing:10px;--divider-pattern-height:24px;--divider-pattern-size:20px;--divider-pattern-url:none;--divider-pattern-repeat:repeat-x}.elementor-widget-divider .elementor-divider{display:flex}.elementor-widget-divider .elementor-divider__text{font-size:15px;line-height:1;max-width:95%}.elementor-widget-divider .elementor-divider__element{margin:0 var(--divider-element-spacing);flex-shrink:0}.elementor-widget-divider .elementor-icon{font-size:var(--divider-icon-size)}.elementor-widget-divider .elementor-divider-separator{display:flex;margin:0;direction:ltr}.elementor-widget-divider--view-line_icon .elementor-divider-separator,.elementor-widget-divider--view-line_text .elementor-divider-separator{align-items:center}.elementor-widget-divider--view-line_icon .elementor-divider-separator:after,.elementor-widget-divider--view-line_icon .elementor-divider-separator:before,.elementor-widget-divider--view-line_text .elementor-divider-separator:after,.elementor-widget-divider--view-line_text .elementor-divider-separator:before{display:block;content:\"\";border-block-end:0;flex-grow:1;border-block-start:var(--divider-border-width) var(--divider-border-style) var(--divider-color)}.elementor-widget-divider--element-align-left .elementor-divider .elementor-divider-separator>.elementor-divider__svg:first-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-left .elementor-divider-separator:before{content:none}.elementor-widget-divider--element-align-left .elementor-divider__element{margin-left:0}.elementor-widget-divider--element-align-right .elementor-divider .elementor-divider-separator>.elementor-divider__svg:last-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-right .elementor-divider-separator:after{content:none}.elementor-widget-divider--element-align-right .elementor-divider__element{margin-right:0}.elementor-widget-divider--element-align-start .elementor-divider .elementor-divider-separator>.elementor-divider__svg:first-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-start .elementor-divider-separator:before{content:none}.elementor-widget-divider--element-align-start .elementor-divider__element{margin-inline-start:0}.elementor-widget-divider--element-align-end .elementor-divider .elementor-divider-separator>.elementor-divider__svg:last-of-type{flex-grow:0;flex-shrink:100}.elementor-widget-divider--element-align-end .elementor-divider-separator:after{content:none}.elementor-widget-divider--element-align-end .elementor-divider__element{margin-inline-end:0}.elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon) .elementor-divider-separator{border-block-start:var(--divider-border-width) var(--divider-border-style) var(--divider-color)}.elementor-widget-divider--separator-type-pattern{--divider-border-style:none}.elementor-widget-divider--separator-type-pattern.elementor-widget-divider--view-line .elementor-divider-separator,.elementor-widget-divider--separator-type-pattern:not(.elementor-widget-divider--view-line) .elementor-divider-separator:after,.elementor-widget-divider--separator-type-pattern:not(.elementor-widget-divider--view-line) .elementor-divider-separator:before,.elementor-widget-divider--separator-type-pattern:not([class*=elementor-widget-divider--view]) .elementor-divider-separator{width:100%;min-height:var(--divider-pattern-height);-webkit-mask-size:var(--divider-pattern-size) 100%;mask-size:var(--divider-pattern-size) 100%;-webkit-mask-repeat:var(--divider-pattern-repeat);mask-repeat:var(--divider-pattern-repeat);background-color:var(--divider-color);-webkit-mask-image:var(--divider-pattern-url);mask-image:var(--divider-pattern-url)}.elementor-widget-divider--no-spacing{--divider-pattern-size:auto}.elementor-widget-divider--bg-round{--divider-pattern-repeat:round}.rtl .elementor-widget-divider .elementor-divider__text{direction:rtl}.e-con-inner>.elementor-widget-divider,.e-con>.elementor-widget-divider{width:var(--container-widget-width,100%);--flex-grow:var(--container-widget-flex-grow)}<\/style>\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<div class=\"elementor-element elementor-element-303ad48 elementor-widget elementor-widget-heading\" data-id=\"303ad48\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.19.0 - 07-02-2024 *\/\n.elementor-heading-title{padding:0;margin:0;line-height:1}.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}<\/style><h2 class=\"elementor-heading-title elementor-size-default\">Project Overview<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-60001f9 elementor-widget elementor-widget-text-editor\" data-id=\"60001f9\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.19.0 - 07-02-2024 *\/\n.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:#69727d;color:#fff}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap{color:#69727d;border:3px solid;background-color:transparent}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap{margin-top:8px}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap-letter{width:1em;height:1em}.elementor-widget-text-editor .elementor-drop-cap{float:left;text-align:center;line-height:1;font-size:50px}.elementor-widget-text-editor .elementor-drop-cap-letter{display:inline-block}<\/style>\t\t\t\t<p>For my previous company, I developed a design system for a SaaS project using the Atomic Design methodology. We chose this approach because it helps break down complex interfaces into simpler, manageable components. Starting with basic elements like buttons and input fields (atoms), we combined these into functional units (molecules), and then into larger sections (organisms). This method made it easier to maintain consistency across the platform and allowed us to build and update features quickly. It was really effective for keeping our design uniform and scalable, which is super important for a growing SaaS product.<\/p>\t\t\t\t\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-96fd02a e-flex e-con-boxed e-con e-parent\" data-id=\"96fd02a\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2303adc elementor-invisible elementor-widget elementor-widget-image\" data-id=\"2303adc\" data-element_type=\"widget\" data-settings=\"{&quot;_animation&quot;:&quot;fadeInUp&quot;}\" 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=\"800\" height=\"446\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Screenshot-2024-04-21-at-5.07.20\u202fAM.png\" class=\"attachment-large size-large wp-image-1354\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3b38e02 e-flex e-con-boxed e-con e-parent\" data-id=\"3b38e02\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2b22457 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"2b22457\" 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<div class=\"elementor-element elementor-element-de95719 elementor-widget elementor-widget-heading\" data-id=\"de95719\" 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\">What is Atomic design system ?<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d4dafc4 elementor-widget elementor-widget-text-editor\" data-id=\"d4dafc4\" 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>The Atomic Design System is a method used in designing websites and apps that breaks down the interface into smaller, simpler components and then builds them up into more complex structures. This approach is inspired by how atoms and molecules work in science.<\/p><ol><li><b>Atoms &#8211; <\/b>These are the smallest parts, like buttons and text fields.<\/li><li><b>Molecules <\/b>&#8211; When you combine atoms together, like putting a label with a text field to make a search box.<\/li><li><b>Organisms &#8211;<\/b> Larger groups of molecules combined, like a whole header with a logo, navigation, and search box.<\/li><li><b>Templates &#8211; <\/b>These are like blueprints or layouts made by placing organisms into a design.<\/li><li><b>Pages &#8211;<\/b> Finally, templates turn into full pages when you add real content that people will see.<\/li><\/ol>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ddd9cec elementor-widget elementor-widget-image\" data-id=\"ddd9cec\" 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=\"800\" height=\"187\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Screenshot-2024-04-21-at-4.40.24\u202fAM.png\" class=\"attachment-large size-large wp-image-1348\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-470fb3d e-flex e-con-boxed e-con e-parent\" data-id=\"470fb3d\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0b5b81b elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"0b5b81b\" 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<div class=\"elementor-element elementor-element-4faa8a0 elementor-widget elementor-widget-heading\" data-id=\"4faa8a0\" 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\">Starting With Atoms<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1ab0e4b elementor-widget elementor-widget-text-editor\" data-id=\"1ab0e4b\" 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>Typography<\/li><li>Colors<\/li><li>Icons<\/li><li>Checkboxes<\/li><li>Avatar<\/li><li>Switch<\/li><li>Buttons<\/li><li>Links<\/li><li>Pills<\/li><li>Grid Actions<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3ef1ce2 e-flex e-con-boxed e-con e-parent\" data-id=\"3ef1ce2\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-89600d7 elementor-widget elementor-widget-image\" data-id=\"89600d7\" 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=\"484\" height=\"1024\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Atoms.png\" class=\"attachment-large size-large wp-image-1367\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-47981ae e-flex e-con-boxed e-con e-parent\" data-id=\"47981ae\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a2acc32 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"a2acc32\" 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<div class=\"elementor-element elementor-element-1905edf elementor-widget elementor-widget-heading\" data-id=\"1905edf\" 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\">Welcome To Molecules<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ecfd8bc e-flex e-con-boxed e-con e-parent\" data-id=\"ecfd8bc\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-38da5c4 e-con-full e-flex e-con e-child\" data-id=\"38da5c4\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-827b010 elementor-widget elementor-widget-text-editor\" data-id=\"827b010\" 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>Headings<\/li><\/ul><ul><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Alert<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Page Actions<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Attributes card<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">External Documentation<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Filter Panel<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Quick Actions<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">External Contacts<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Implementer<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Notify on Failure<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Owner<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Requester<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Stakeholder<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Subject Matter Experts<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Autocomplete<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Back to Link<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Breadcrumbs<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Card<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Create Comment<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Confirm Dialog<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Data Quality Score Bar<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Dual icon<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Errors<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Field Unavailable<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Header Card<\/span><\/li><li><span style=\"white-space-collapse: preserve; background-color: transparent; text-align: var(--text-align);\">Header Add<\/span><\/li><li style=\"font-size: 18px;\">Relative Time<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ac772cf e-con-full e-flex e-con e-child\" data-id=\"ac772cf\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a9437e3 elementor-widget elementor-widget-text-editor\" data-id=\"a9437e3\" 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>Header Notifications<\/li><li>Header<\/li><li>Help<\/li><li>Markdown Renderer<\/li><li>Date Time Input<\/li><li>Duration Input<\/li><li>Replication Type<\/li><li>Score Meter<\/li><li>Select Categories<\/li><li>Select Users<\/li><li>Select<\/li><li>Status With Dot<\/li><li>Strategy Card<\/li><li>Text Area<\/li><li>Text Input<\/li><li>Daily Recurrence Fields<\/li><li>Recurrence Display<\/li><li>Hourly Recurrence Fields<\/li><li>Monthly Recurrence Fields<\/li><li>Recurrence Control<\/li><li>Weekly Recurrence Fields<\/li><li>Dictionaries Card<\/li><li>Inline Alert<\/li><li>Debounced Search<\/li><li>Search Bar<\/li><li>List Display<\/li><li>Landing Page Card<\/li><\/ul>\t\t\t\t\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d6f6d22 e-flex e-con-boxed e-con e-parent\" data-id=\"d6f6d22\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-04970f8 elementor-widget elementor-widget-image\" data-id=\"04970f8\" 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=\"441\" height=\"1024\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Molecules1.png\" class=\"attachment-large size-large wp-image-1369\" alt=\"\" \/>\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<div class=\"elementor-element elementor-element-fa61743 elementor-widget elementor-widget-image\" data-id=\"fa61743\" 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=\"313\" height=\"1024\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Molecules2.png\" class=\"attachment-large size-large wp-image-1370\" alt=\"\" \/>\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<div class=\"elementor-element elementor-element-805ab20 elementor-widget elementor-widget-image\" data-id=\"805ab20\" 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=\"426\" height=\"1024\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Molecules3.png\" class=\"attachment-large size-large wp-image-1371\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fa2b713 e-flex e-con-boxed e-con e-parent\" data-id=\"fa2b713\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-38541ef elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"38541ef\" 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<div class=\"elementor-element elementor-element-78f4497 elementor-widget elementor-widget-heading\" data-id=\"78f4497\" 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\">Welcome To Organisms<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fdc9bdd elementor-widget elementor-widget-text-editor\" data-id=\"fdc9bdd\" 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>Tab Nav<\/li><li>Paginator<\/li><li>Static Grid<\/li><li>Components Grid<\/li><\/ul>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7d00d93 e-flex e-con-boxed e-con e-parent\" data-id=\"7d00d93\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-de25141 elementor-widget elementor-widget-image\" data-id=\"de25141\" 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=\"800\" height=\"934\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Organisms.png\" class=\"attachment-large size-large wp-image-1379\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bc67924 e-flex e-con-boxed e-con e-parent\" data-id=\"bc67924\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3b718b5 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"3b718b5\" 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<div class=\"elementor-element elementor-element-57e05ba elementor-widget elementor-widget-heading\" data-id=\"57e05ba\" 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\">Building the Templates<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-11be94f elementor-widget elementor-widget-text-editor\" data-id=\"11be94f\" 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><span style=\"background-color: transparent; text-align: var(--text-align);\">Based on the foundation of atoms, molecules, and organisms, I developed templates, which then served as the groundwork for creating the final UI and pages.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-41c9229 e-flex e-con-boxed e-con e-parent\" data-id=\"41c9229\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5c1d46f elementor-widget elementor-widget-image\" data-id=\"5c1d46f\" 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=\"800\" height=\"914\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/04\/Templates.png\" class=\"attachment-large size-large wp-image-1380\" alt=\"\" \/>\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\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-44cb2fd e-flex e-con-boxed e-con e-parent\" data-id=\"44cb2fd\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\" data-core-v316-plus=\"true\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ce6d89a e-con-full e-flex e-con e-child\" data-id=\"ce6d89a\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9f0f042 elementor-widget elementor-widget-heading\" data-id=\"9f0f042\" 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\">Outcomes<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-287a02f elementor-widget elementor-widget-text-editor\" data-id=\"287a02f\" 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>The design system project turned out to be very successful and is currently in use. As this was the first version, we&#8217;ve made several improvements since its initial creation, enhancing its functionality and design significantly. For now, I only have the rights to showcase the design system itself in my portfolio, not the entire UI or any specific pages. This foundational work has set a strong precedent for further development and application within the project.<br><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7d7c879 e-con-full e-flex e-con e-child\" data-id=\"7d7c879\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1d44fc9 elementor-widget elementor-widget-image\" data-id=\"1d44fc9\" 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=\"421\" height=\"421\" src=\"https:\/\/amit.onobit.com\/wp-content\/uploads\/2024\/03\/Amit-Avatar.png\" class=\"attachment-large size-large wp-image-356\" alt=\"\" \/>\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<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Design System Web 2022 Project Overview For my previous company, I developed a design system for a SaaS project using the Atomic Design methodology. We chose this approach because it helps break down complex interfaces into simpler, manageable components. Starting with basic elements like buttons and input fields (atoms), we combined these into functional units [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/pages\/1343"}],"collection":[{"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/amit.onobit.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1343"}],"version-history":[{"count":25,"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/pages\/1343\/revisions"}],"predecessor-version":[{"id":1485,"href":"https:\/\/amit.onobit.com\/index.php?rest_route=\/wp\/v2\/pages\/1343\/revisions\/1485"}],"wp:attachment":[{"href":"https:\/\/amit.onobit.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1343"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}