Styling with CSS, Tailwind, or Styled Components - NAON LABS

Home
Courses
Blogs
About

Styling with CSS, Tailwind, or Styled Components - NAON LABS

Home
Courses
Blogs
About

Hi, Welcome back!

Keep me signed in

Forgot Password?

Don't have an account?

Upskill. Onboard.
Lead. Repeat.

From individual learners to enterprise telams — create, deliver, and scale impactful learning with a platform designed for growth.

Start Contact Sales

{"blocks":{"dpliwl4a":{"visibility":true,"collapse":false,"name":"collection","title":"Collection","properties":{"tag":"div","dynamicContent":{"type":null,"collectionType":"users","items":3,"current_page":1,"pagination":false,"pagination_type":"","filters":[{"type":"role","id":"role","title":"Role","items":[{"condition":"in","values":["tutor_instructor"],"relation":"OR"}]}],"sorting":[],"offset":0,"inherit":false,"uiState":"items"},"symbolElPropId":"sepiw3a5z"},"styleIds":["workademy_dpc80nnq"],"className":"","source":"kirki","children":["dpej7twd","dp4p9lw0","dpewtof4"],"id":"dpliwl4a","parentId":"dp6d0464","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true,"hide":false},"dpej7twd":{"visibility":true,"collapse":false,"name":"items","title":"Instructors","properties":{"attributes":[],"symbolElPropId":"sephy231n"},"styleIds":["workademy_dpgzd6f0"],"className":"","source":"kirki","children":["dpmpe6e1"],"id":"dpej7twd","parentId":"dpliwl4a","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpmpe6e1":{"styleIds":["workademy_dpl30v92"],"visibility":true,"collapse":false,"name":"item","title":"Item","properties":{"tag":"div","attributes":[],"symbolElPropId":"sepo4mspf"},"className":"","source":"kirki","children":["dppmbdxz"],"id":"dpmpe6e1","parentId":"dpej7twd","template_mounted":true},"dppmbdxz":{"visibility":true,"collapse":false,"name":"div","title":"Items 1","properties":{"tag":"div","symbolElPropId":"sepiuya57"},"styleIds":["workademy_dpf06hw1"],"className":"","source":"kirki","children":["dpg9tqjt"],"id":"dppmbdxz","parentId":"dpmpe6e1","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dpg9tqjt":{"visibility":true,"collapse":false,"name":"div","title":"Image Wrapper","properties":{"tag":"div","symbolElPropId":"sep4urlbp"},"styleIds":["workademy_dp9s7crk"],"className":"","source":"kirki","children":["dplz43g6"],"id":"dpg9tqjt","parentId":"dppmbdxz","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dplz43g6":{"visibility":true,"collapse":false,"name":"image","title":"Image","properties":{"tag":"img","noEndTag":true,"type":"href","load":"lazy","hiDPIStatus":false,"width":{"value":"auto","unit":""},"height":{"value":"auto","unit":""},"attributes":{"src":"https:\/\/labs.naon.id\/wp-content\/uploads\/2026\/07\/cta1.webp","alt":"cta1","href":"","target":""},"wp_attachment_id":77,"symbolElPropId":"sep94xlp9","dynamicContent":{"type":"user","value":"profile_image"}},"styleIds":["workademy_dp9j9fy9"],"className":"","source":"kirki","id":"dplz43g6","parentId":"dpg9tqjt","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dp4p9lw0":{"visibility":true,"collapse":false,"name":"pagination","title":"Pagination","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination"},"symbolElPropId":"sepsp23i7"},"styleIds":["workademy_kirki_pagination"],"className":"","source":"kirki","children":["dpomkgpd"],"id":"dp4p9lw0","parentId":"dpliwl4a","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpomkgpd":{"styleIds":["workademy_kirki_pagination_item"],"visibility":true,"collapse":false,"name":"pagination-item","title":"Pagination Item","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-item"},"symbolElPropId":"sepju54sy"},"className":"","source":"kirki","children":["dp7t3enu"],"id":"dpomkgpd","parentId":"dp4p9lw0","template_mounted":true},"dp7t3enu":{"styleIds":["workademy_kirki_pagination_number"],"visibility":true,"collapse":false,"name":"pagination-number","title":"Pagination Number","properties":{"tag":"span","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-number"},"symbolElPropId":"sep793xct"},"className":"","source":"kirki","children":[],"id":"dp7t3enu","parentId":"dpomkgpd"},"dpewtof4":{"visibility":true,"collapse":false,"name":"empty","title":"Empty","properties":{"attributes":[],"symbolElPropId":"sepuzucjb"},"styleIds":[],"className":"","source":"kirki","children":[],"id":"dpewtof4","parentId":"dpliwl4a","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}}},"styles":{"workademy_dpc80nnq":{"id":"workademy_dpc80nnq","type":"class","name":"workademy_dpwjs9l1","variant":{"mobile":"min-width:100%;height:auto;"},"isSymbolStyle":true,"fromStage":true,"isGlobal":true},"workademy_dpgzd6f0":{"id":"workademy_dpgzd6f0","type":"class","name":"workademy_dpjk1u8e","variant":{"md":"min-height:auto;height:auto;overflow:hidden;display:flex;flex-direction:column;row-gap:24px;justify-content:space-between;writing-mode:unset;transform:none;column-gap:12px;","mobile":"flex-direction:row;min-width:auto;column-gap:0px;justify-content:space-around;overflow:visible;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dpl30v92":{"id":"workademy_dpl30v92","type":"class","name":"workademy_dpxth9n1","variant":{"mobile":"width:30%;"},"isSymbolStyle":true,"isGlobal":true,"fromStage":true},"workademy_dpf06hw1":{"id":"workademy_dpf06hw1","type":"class","name":"workademy_dpdqyb3j","variant":{"md":"display:flex;flex-direction:column;row-gap:24px;justify-content:space-around;height:auto;width:auto;min-width:100%;transform:none;","tablet":"row-gap:13px;","mobile":"flex-direction:row;row-gap:0px;min-width:auto;width:100%;"},"isSymbolStyle":true},"workademy_dp9s7crk":{"id":"workademy_dp9s7crk","type":"class","name":"workademy_dpa2muw3","variant":{"md":"","mobile":"width:100%;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dp9j9fy9":{"id":"workademy_dp9j9fy9","type":"class","name":["workademy_dpfct0sl"],"variant":{"md":"width:100%;max-width:184px;aspect-ratio:1\/1;border-radius:100%;","tablet":"max-width:100px;","mobile":"max-width:none;"},"isSymbolStyle":true},"workademy_kirki_pagination":{"id":"workademy_kirki_pagination","type":"class","name":"workademy_kirki-pagination","variant":{"md":"display:flex;justify-content:center;gap:8px;"},"isSymbolStyle":true},"workademy_kirki_pagination_item":{"id":"workademy_kirki_pagination_item","type":"class","name":"workademy_kirki-pagination-item","variant":{"md":"display:flex;justify-content:center;align-items-center;font-size:16px; padding:4px 12px;border: 1px solid #c7c9cb;cursor:pointer;border-radius:5px;"},"isSymbolStyle":true},"workademy_kirki_pagination_number":{"id":"workademy_kirki_pagination_number","type":"class","name":"workademy_kirki-pagination-number","variant":{"md":""},"isSymbolStyle":true}}}

{"blocks":{"dpxruvba":{"visibility":true,"collapse":false,"name":"collection","title":"Collection","properties":{"tag":"div","dynamicContent":{"type":null,"collectionType":"users","items":3,"current_page":1,"pagination":false,"pagination_type":"","filters":[{"type":"role","id":"role","title":"Role","items":[{"condition":"in","values":["tutor_instructor"],"relation":"OR"}]}],"sorting":[],"offset":0,"inherit":false,"uiState":"items"},"symbolElPropId":"sepiw3a5z"},"styleIds":["workademy_dpc80nnq"],"className":"","source":"kirki","children":["dpp8f4ws","dpqwdxwt","dp3fz5u9"],"id":"dpxruvba","parentId":"dp6d0464","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true,"hide":false},"dpp8f4ws":{"visibility":true,"collapse":false,"name":"items","title":"Instructors","properties":{"attributes":[],"symbolElPropId":"sephy231n"},"styleIds":["workademy_dpgzd6f0"],"className":"","source":"kirki","children":["dpu0exd0"],"id":"dpp8f4ws","parentId":"dpxruvba","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpu0exd0":{"styleIds":["workademy_dpl30v92"],"visibility":true,"collapse":false,"name":"item","title":"Item","properties":{"tag":"div","attributes":[],"symbolElPropId":"sepo4mspf"},"className":"","source":"kirki","children":["dphppjwd"],"id":"dpu0exd0","parentId":"dpp8f4ws","template_mounted":true},"dphppjwd":{"visibility":true,"collapse":false,"name":"div","title":"Items 1","properties":{"tag":"div","symbolElPropId":"sepiuya57"},"styleIds":["workademy_dpf06hw1"],"className":"","source":"kirki","children":["dpsf2ftn"],"id":"dphppjwd","parentId":"dpu0exd0","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dpsf2ftn":{"visibility":true,"collapse":false,"name":"div","title":"Image Wrapper","properties":{"tag":"div","symbolElPropId":"sep4urlbp"},"styleIds":["workademy_dp9s7crk"],"className":"","source":"kirki","children":["dphkqqya"],"id":"dpsf2ftn","parentId":"dphppjwd","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dphkqqya":{"visibility":true,"collapse":false,"name":"image","title":"Image","properties":{"tag":"img","noEndTag":true,"type":"href","load":"lazy","hiDPIStatus":false,"width":{"value":"auto","unit":""},"height":{"value":"auto","unit":""},"attributes":{"src":"https:\/\/labs.naon.id\/wp-content\/uploads\/2026\/07\/cta1.webp","alt":"cta1","href":"","target":""},"wp_attachment_id":77,"symbolElPropId":"sep94xlp9","dynamicContent":{"type":"user","value":"profile_image"}},"styleIds":["workademy_dp9j9fy9"],"className":"","source":"kirki","id":"dphkqqya","parentId":"dpsf2ftn","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dpqwdxwt":{"visibility":true,"collapse":false,"name":"pagination","title":"Pagination","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination"},"symbolElPropId":"sepsp23i7"},"styleIds":["workademy_kirki_pagination"],"className":"","source":"kirki","children":["dpwqxbgi"],"id":"dpqwdxwt","parentId":"dpxruvba","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpwqxbgi":{"styleIds":["workademy_kirki_pagination_item"],"visibility":true,"collapse":false,"name":"pagination-item","title":"Pagination Item","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-item"},"symbolElPropId":"sepju54sy"},"className":"","source":"kirki","children":["dp7ah7nv"],"id":"dpwqxbgi","parentId":"dpqwdxwt","template_mounted":true},"dp7ah7nv":{"styleIds":["workademy_kirki_pagination_number"],"visibility":true,"collapse":false,"name":"pagination-number","title":"Pagination Number","properties":{"tag":"span","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-number"},"symbolElPropId":"sep793xct"},"className":"","source":"kirki","children":[],"id":"dp7ah7nv","parentId":"dpwqxbgi"},"dp3fz5u9":{"visibility":true,"collapse":false,"name":"empty","title":"Empty","properties":{"attributes":[],"symbolElPropId":"sepuzucjb"},"styleIds":[],"className":"","source":"kirki","children":[],"id":"dp3fz5u9","parentId":"dpxruvba","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}}},"styles":{"workademy_dpc80nnq":{"id":"workademy_dpc80nnq","type":"class","name":"workademy_dpwjs9l1","variant":{"mobile":"min-width:100%;height:auto;"},"isSymbolStyle":true,"fromStage":true,"isGlobal":true},"workademy_dpgzd6f0":{"id":"workademy_dpgzd6f0","type":"class","name":"workademy_dpjk1u8e","variant":{"md":"min-height:auto;height:auto;overflow:hidden;display:flex;flex-direction:column;row-gap:24px;justify-content:space-between;writing-mode:unset;transform:none;column-gap:12px;","mobile":"flex-direction:row;min-width:auto;column-gap:0px;justify-content:space-around;overflow:visible;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dpl30v92":{"id":"workademy_dpl30v92","type":"class","name":"workademy_dpxth9n1","variant":{"mobile":"width:30%;"},"isSymbolStyle":true,"isGlobal":true,"fromStage":true},"workademy_dpf06hw1":{"id":"workademy_dpf06hw1","type":"class","name":"workademy_dpdqyb3j","variant":{"md":"display:flex;flex-direction:column;row-gap:24px;justify-content:space-around;height:auto;width:auto;min-width:100%;transform:none;","tablet":"row-gap:13px;","mobile":"flex-direction:row;row-gap:0px;min-width:auto;width:100%;"},"isSymbolStyle":true},"workademy_dp9s7crk":{"id":"workademy_dp9s7crk","type":"class","name":"workademy_dpa2muw3","variant":{"md":"","mobile":"width:100%;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dp9j9fy9":{"id":"workademy_dp9j9fy9","type":"class","name":["workademy_dpfct0sl"],"variant":{"md":"width:100%;max-width:184px;aspect-ratio:1\/1;border-radius:100%;","tablet":"max-width:100px;","mobile":"max-width:none;"},"isSymbolStyle":true},"workademy_kirki_pagination":{"id":"workademy_kirki_pagination","type":"class","name":"workademy_kirki-pagination","variant":{"md":"display:flex;justify-content:center;gap:8px;"},"isSymbolStyle":true},"workademy_kirki_pagination_item":{"id":"workademy_kirki_pagination_item","type":"class","name":"workademy_kirki-pagination-item","variant":{"md":"display:flex;justify-content:center;align-items-center;font-size:16px; padding:4px 12px;border: 1px solid #c7c9cb;cursor:pointer;border-radius:5px;"},"isSymbolStyle":true},"workademy_kirki_pagination_number":{"id":"workademy_kirki_pagination_number","type":"class","name":"workademy_kirki-pagination-number","variant":{"md":""},"isSymbolStyle":true}}}

Get Newsletter!

Successfully Submited !!!

Submit failed

Company

About FAQs Contact Pricing Privacy Policy Terms & Conditions

Quick Links

Home Courses Blogs Instructors Testimonials

Popular Categories

{"blocks":{"dpnl4tlz":{"visibility":true,"collapse":false,"name":"collection","title":"Collection","properties":{"tag":"div","dynamicContent":{"type":"courses","collectionType":"terms","items":4,"current_page":1,"pagination":false,"pagination_type":"","filters":[],"sorting":[],"offset":0,"taxonomy":"course-category","inherit":false},"symbolElPropId":"sepz642y6"},"styleIds":[],"className":"","source":"kirki","children":["dp0um94h","dp8n2w2n","dp1oad1y"],"id":"dpnl4tlz","parentId":"dpsbdz7y","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dp0um94h":{"visibility":true,"collapse":false,"name":"items","title":"Items","properties":{"attributes":[],"symbolElPropId":"sepw69sv8"},"styleIds":["workademy_dp33l706"],"className":"","source":"kirki","children":["dpdytvfe"],"id":"dp0um94h","parentId":"dpnl4tlz","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpdytvfe":{"styleIds":[],"visibility":true,"collapse":false,"name":"item","title":"Item","properties":{"tag":"div","attributes":[],"symbolElPropId":"sepnjl1z2"},"className":"","source":"kirki","children":["dp1iyl6y"],"id":"dpdytvfe","parentId":"dp0um94h","template_mounted":true},"dp1iyl6y":{"visibility":true,"collapse":false,"name":"link-block","title":"Link","properties":{"tag":"a","type":"href","attributes":{"href":"","target":""},"isActive":false,"dynamicContent":{"type":"post","value":"post_page_link"},"symbolElPropId":"sepr1lgho"},"styleIds":["workademy_dpi0bz29"],"className":"","source":"kirki","children":["dpxauqpz"],"id":"dp1iyl6y","parentId":"dpdytvfe","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dpxauqpz":{"styleIds":[],"visibility":true,"collapse":false,"name":"text","title":"Text","properties":{"contents":["AI + Data"],"tag":"span","dynamicContent":{"type":"term","value":"name"},"symbolElPropId":"sep5u4xvz"},"className":"","source":"kirki","id":"dpxauqpz","parentId":"dp1iyl6y"},"dp8n2w2n":{"visibility":true,"collapse":false,"name":"empty","title":"Empty","properties":{"attributes":[],"symbolElPropId":"sep3m2z9y"},"styleIds":[],"className":"","source":"kirki","children":[],"id":"dp8n2w2n","parentId":"dpnl4tlz","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true}},"dp1oad1y":{"visibility":true,"collapse":false,"name":"pagination","title":"Pagination","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination"},"symbolElPropId":"sepb4acew"},"styleIds":["workademy_dp5elg0r"],"className":"","source":"kirki","children":["dplqrygt"],"id":"dp1oad1y","parentId":"dpnl4tlz","stylePanels":{"typography":true,"composition":true,"size":true,"background":true,"stroke":true,"shadow":true,"effects":true,"position":true,"transform":true,"interaction":true,"animation":true},"template_mounted":true},"dplqrygt":{"styleIds":["workademy_dpodt7w1"],"visibility":true,"collapse":false,"name":"pagination-item","title":"Pagination Item","properties":{"tag":"div","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-item"},"symbolElPropId":"seprorjhe"},"className":"","source":"kirki","children":["dp5dyuq1"],"id":"dplqrygt","parentId":"dp1oad1y","template_mounted":true},"dp5dyuq1":{"styleIds":["workademy_dphl53gi"],"visibility":true,"collapse":false,"name":"pagination-number","title":"Pagination Number","properties":{"tag":"span","componentType":"pagination","attributes":{"data-kirki-pagination":"pagination-number"},"symbolElPropId":"sep3383gf"},"className":"","source":"kirki","children":[],"id":"dp5dyuq1","parentId":"dplqrygt"}},"styles":{"workademy_dp33l706":{"id":"workademy_dp33l706","type":"class","name":"workademy_dp45z1xj","variant":{"md":"display:flex;flex-direction:column;align-items:flex-start;row-gap:8px;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dpi0bz29":{"id":"workademy_dpi0bz29","type":"class","name":"workademy_dpc7jlnf","variant":{"md":"font-size:16px;font-family:var(--workademy_dpktqviy);font-weight:400;color:rgba(255, 255, 255, 0.8);fill:rgba(255, 255, 255, 0.8);line-height:1.25em;font-style:normal;text-decoration:none;letter-spacing:0px;transition-property:color;transition-duration:300ms;transition-delay:0ms;transition-timing-function:ease;","md_hover":"color:rgba(255, 255, 255, 1);fill:rgba(255, 255, 255, 1);","tablet":"font-size:16px;line-height:24px;letter-spacing:-0.16px;"},"isGlobal":true,"fromStage":true,"isSymbolStyle":true},"workademy_dp5elg0r":{"id":"workademy_dp5elg0r","type":"class","name":"workademy_dp3h3c61","variant":{"md":"display:flex;justify-content:center;gap:8px;"},"isSymbolStyle":true},"workademy_dpodt7w1":{"id":"workademy_dpodt7w1","type":"class","name":"workademy_dpdyh8ja","variant":{"md":"display:flex;justify-content:center;align-items-center;font-size:16px; padding:4px 12px;border: 1px solid #c7c9cb;cursor:pointer;border-radius:5px;"},"isSymbolStyle":true},"workademy_dphl53gi":{"id":"workademy_dphl53gi","type":"class","name":"workademy_dpqad5y4","variant":{"md":""},"isSymbolStyle":true}}}

Communication Skills

Join our community

© [droip data="current_year"] Workademy. All rights reserved.