[{"data":1,"prerenderedAt":563},["ShallowReactive",2],{"navigation_docs":3,"-nextjs-customization":186,"-nextjs-customization-surround":558},[4,96,136,155],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":95},"WordPress","i-lucide-folder-git","\u002Fwordpress","01.wordpress",[10,15,20,25,30,35,40,45,50,55,60,65,70,75,80,85,90],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","\u002Fwordpress\u002Fintroduction","01.wordpress\u002F01.introduction","i-lucide-rocket",{"title":16,"path":17,"stem":18,"icon":19},"Server Requirements","\u002Fwordpress\u002Fserver-requirements","01.wordpress\u002F02.server-requirements","i-lucide-server",{"title":21,"path":22,"stem":23,"icon":24},"Theme Installation","\u002Fwordpress\u002Ftheme-installation","01.wordpress\u002F03.theme-installation","i-lucide-paintbrush",{"title":26,"path":27,"stem":28,"icon":29},"Child Theme","\u002Fwordpress\u002Fchild-theme","01.wordpress\u002F04.child-theme","i-lucide-layers",{"title":31,"path":32,"stem":33,"icon":34},"Plugin Installation","\u002Fwordpress\u002Fplugin-installation","01.wordpress\u002F05.plugin-installation","i-lucide-puzzle",{"title":36,"path":37,"stem":38,"icon":39},"Demo Import","\u002Fwordpress\u002Fdemo-import","01.wordpress\u002F06.demo-import","i-lucide-download",{"title":41,"path":42,"stem":43,"icon":44},"Theme Options","\u002Fwordpress\u002Ftheme-options","01.wordpress\u002F07.theme-options","i-lucide-settings",{"title":46,"path":47,"stem":48,"icon":49},"Header Logo","\u002Fwordpress\u002Fheader-logo","01.wordpress\u002F08.header-logo","i-lucide-image",{"title":51,"path":52,"stem":53,"icon":54},"Header & Footer Builder","\u002Fwordpress\u002Fheader-footer-builder","01.wordpress\u002F09.header-footer-builder","i-lucide-layout-template",{"title":56,"path":57,"stem":58,"icon":59},"GSAP Animation","\u002Fwordpress\u002Fgsap-animation","01.wordpress\u002F10.gsap-animation","i-lucide-waves",{"title":61,"path":62,"stem":63,"icon":64},"MailChimp Integration","\u002Fwordpress\u002Fmailchimp-integration","01.wordpress\u002F11.mailchimp-integration","i-simple-icons-mailchimp",{"title":66,"path":67,"stem":68,"icon":69},"Mega Menu","\u002Fwordpress\u002Fmega-menu","01.wordpress\u002F12.mega-menu","i-lucide-menu",{"title":71,"path":72,"stem":73,"icon":74},"Contact Form","\u002Fwordpress\u002Fcontact-form","01.wordpress\u002F13.contact-form","i-lucide-mail",{"title":76,"path":77,"stem":78,"icon":79},"Template Library","\u002Fwordpress\u002Ftemplate-library","01.wordpress\u002F14.template-library","i-lucide-layout-grid",{"title":81,"path":82,"stem":83,"icon":84},"Theme Update","\u002Fwordpress\u002Ftheme-update","01.wordpress\u002F15.theme-update","i-lucide-refresh-cw",{"title":86,"path":87,"stem":88,"icon":89},"Speed Optimization","\u002Fwordpress\u002Fspeed-optimization","01.wordpress\u002F16.speed-optimization","i-lucide-gauge",{"title":91,"path":92,"stem":93,"icon":94},"URL Cleanup","\u002Fwordpress\u002Furl-cleanup","01.wordpress\u002F17.url-cleanup","i-lucide-brush-cleaning",false,{"title":97,"icon":6,"path":98,"stem":99,"children":100,"page":95},"HTML","\u002Fhtml","02.html",[101,106,112,118,124,130],{"title":102,"path":103,"stem":104,"icon":14,"order":105},"Get Started","\u002Fhtml\u002Fgetting-started","02.html\u002F01.getting-started",1,{"title":107,"path":108,"stem":109,"icon":110,"order":111},"Folder Structure","\u002Fhtml\u002Ffolder-structure","02.html\u002F02.folder-structure","i-lucide-folder-tree",2,{"title":113,"path":114,"stem":115,"icon":116,"order":117},"Customization","\u002Fhtml\u002Fcustomization","02.html\u002F03.customization","i-lucide-sliders",3,{"title":119,"path":120,"stem":121,"icon":122,"order":123},"Update Icons","\u002Fhtml\u002Fupdate-icons","02.html\u002F04.update-icons","i-lucide-shapes",4,{"title":125,"path":126,"stem":127,"icon":128,"order":129},"Credit","\u002Fhtml\u002Fcredit","02.html\u002F05.credit","i-lucide-award",5,{"title":131,"path":132,"stem":133,"icon":134,"order":135},"Deployment","\u002Fhtml\u002Fdeployment","02.html\u002F06.deployment","i-lucide-upload-cloud",6,{"title":137,"icon":6,"path":138,"stem":139,"children":140,"page":95},"Next.js","\u002Fnextjs","03.nextjs",[141,144,147,152],{"title":102,"path":142,"stem":143,"icon":14,"order":105},"\u002Fnextjs\u002Fget-started","03.nextjs\u002F01.get-started",{"title":113,"path":145,"stem":146,"icon":116,"order":111},"\u002Fnextjs\u002Fcustomization","03.nextjs\u002F02.customization",{"title":148,"path":149,"stem":150,"icon":151,"order":117},"Create New Page","\u002Fnextjs\u002Fcreate-new-page","03.nextjs\u002F03.create-new-page","i-lucide-file-plus",{"title":131,"path":153,"stem":154,"icon":134,"order":123},"\u002Fnextjs\u002Fdeployment","03.nextjs\u002F04.deployment",{"title":156,"icon":6,"path":157,"stem":158,"children":159,"page":95},"Hugo","\u002Fhugo","04.hugo",[160,163,166,169,173,178,182],{"title":102,"path":161,"stem":162,"icon":14,"order":105},"\u002Fhugo\u002Fget-started","04.hugo\u002F01.get-started",{"title":113,"path":164,"stem":165,"icon":116,"order":111},"\u002Fhugo\u002Fcustomization","04.hugo\u002F02.customization",{"title":148,"path":167,"stem":168,"icon":151,"order":117},"\u002Fhugo\u002Fcreate-new-page","04.hugo\u002F03.create-new-page",{"title":170,"path":171,"stem":172,"icon":54,"order":123},"Edit Pages","\u002Fhugo\u002Fedit-pages","04.hugo\u002F04.edit-pages",{"title":174,"path":175,"stem":176,"icon":177,"order":129},"Edit Contents","\u002Fhugo\u002Fedit-contents","04.hugo\u002F05.edit-contents","i-lucide-edit",{"title":179,"path":180,"stem":181,"icon":44,"order":135},"Site Configuration","\u002Fhugo\u002Fsite-configuration","04.hugo\u002F06.site-configuration",{"title":131,"path":183,"stem":184,"icon":134,"order":185},"\u002Fhugo\u002Fdeployment","04.hugo\u002F07.deployment",7,{"id":187,"title":113,"body":188,"description":549,"extension":550,"links":551,"meta":552,"navigation":553,"path":145,"seo":554,"stem":146,"__hash__":557},"docs\u002F03.nextjs\u002F02.customization.md",{"type":189,"value":190,"toc":545},"minimark",[191,195,200,208,236,239,355,358,397,401,407,409,530,541],[192,193,194],"p",{},"This guide explains how you can change the look and feel of your project, like its colors and fonts.",[196,197,199],"h2",{"id":198},"customizing-colors","Customizing colors",[192,201,202,203,207],{},"You can change the main colors used throughout the project from ",[204,205,206],"code",{},"src\u002Fstyles\u002Fvariables.css",".",[209,210,211,218,225],"ol",{},[212,213,214,215],"li",{},"Open ",[204,216,217],{},"variables.css",[212,219,220,221,224],{},"Find the ",[204,222,223],{},"\u002F* ==== COLORS ==== *\u002F"," section",[212,226,227,228,231,232,235],{},"Update the ",[204,229,230],{},"--color-*"," variables (for example ",[204,233,234],{},"--color-primary-500",")",[192,237,238],{},"Example:",[240,241,246],"pre",{"className":242,"code":243,"language":244,"meta":245,"style":245},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","@theme {\n  \u002F* =============== COLORS =============== *\u002F\n  --color-primary-500: #864ffe; \u002F* main primary color *\u002F\n  --color-primary-600: #7c31f6; \u002F* darker primary shade *\u002F\n  --color-primary-400: #a585ff; \u002F* lighter primary shade *\u002F\n  --color-secondary: #1a1a1c;\n  --color-accent: #fcfcfc;\n  --color-background-1: #fcfcfd;\n  --color-background-2: #f9fafb;\n}\n","css","",[204,247,248,260,266,281,294,307,317,327,338,349],{"__ignoreMap":245},[249,250,252,256],"span",{"class":251,"line":105},"line",[249,253,255],{"class":254},"s7zQu","@theme",[249,257,259],{"class":258},"sMK4o"," {\n",[249,261,262],{"class":251,"line":111},[249,263,265],{"class":264},"sHwdD","  \u002F* =============== COLORS =============== *\u002F\n",[249,267,268,272,275,278],{"class":251,"line":117},[249,269,271],{"class":270},"sTEyZ","  --color-primary-500: ",[249,273,274],{"class":258},"#",[249,276,277],{"class":270},"864ffe; ",[249,279,280],{"class":264},"\u002F* main primary color *\u002F\n",[249,282,283,286,288,291],{"class":251,"line":123},[249,284,285],{"class":270},"  --color-primary-600: ",[249,287,274],{"class":258},[249,289,290],{"class":270},"7c31f6; ",[249,292,293],{"class":264},"\u002F* darker primary shade *\u002F\n",[249,295,296,299,301,304],{"class":251,"line":129},[249,297,298],{"class":270},"  --color-primary-400: ",[249,300,274],{"class":258},[249,302,303],{"class":270},"a585ff; ",[249,305,306],{"class":264},"\u002F* lighter primary shade *\u002F\n",[249,308,309,312,314],{"class":251,"line":135},[249,310,311],{"class":270},"  --color-secondary: ",[249,313,274],{"class":258},[249,315,316],{"class":270},"1a1a1c;\n",[249,318,319,322,324],{"class":251,"line":185},[249,320,321],{"class":270},"  --color-accent: ",[249,323,274],{"class":258},[249,325,326],{"class":270},"fcfcfc;\n",[249,328,330,333,335],{"class":251,"line":329},8,[249,331,332],{"class":270},"  --color-background-1: ",[249,334,274],{"class":258},[249,336,337],{"class":270},"fcfcfd;\n",[249,339,341,344,346],{"class":251,"line":340},9,[249,342,343],{"class":270},"  --color-background-2: ",[249,345,274],{"class":258},[249,347,348],{"class":270},"f9fafb;\n",[249,350,352],{"class":251,"line":351},10,[249,353,354],{"class":270},"}\n",[192,356,357],{},"Key variables to customize:",[359,360,361,366,372,378,388],"ul",{},[212,362,363,365],{},[204,364,234],{},": main brand color",[212,367,368,371],{},[204,369,370],{},"--color-secondary",": secondary text\u002FUI color",[212,373,374,377],{},[204,375,376],{},"--color-accent",": accent color",[212,379,380,383,384,387],{},[204,381,382],{},"--color-background-1"," … ",[204,385,386],{},"--color-background-11",": background colors",[212,389,390,383,393,396],{},[204,391,392],{},"--color-stroke-1",[204,394,395],{},"--color-stroke-9",": borders\u002Fstrokes",[196,398,400],{"id":399},"customizing-font-size","Customizing font size",[192,402,403,404,406],{},"You can customize font sizes and line heights in ",[204,405,206],{}," under the typography section.",[192,408,238],{},[240,410,412],{"className":242,"code":411,"language":244,"meta":245,"style":245},"@theme {\n  \u002F* =============== TYPOGRAPHY =============== *\u002F\n  --text-heading-1: 4.25rem;\n  --text-heading-1--line-height: 110%;\n  --text-heading-2: 3.25rem;\n  --text-heading-2--line-height: 120%;\n  --text-heading-3: 2.5rem;\n  --text-heading-3--line-height: 120%;\n  --text-heading-4: 2rem;\n  --text-heading-4--line-height: 130%;\n  --text-heading-5: 1.5rem;\n  --text-heading-5--line-height: 140%;\n  --text-heading-6: 1.25rem;\n  --text-heading-6--line-height: 140%;\n  --text-tagline-1: 1rem;\n  --text-tagline-1--line-height: 150%;\n  --text-tagline-2: 0.875rem;\n  --text-tagline-2--line-height: 150%;\n  --text-tagline-3: 0.75rem;\n  --text-tagline-3--line-height: 150%;\n}\n",[204,413,414,420,425,430,435,440,445,450,455,460,465,471,477,483,489,495,501,507,513,519,525],{"__ignoreMap":245},[249,415,416,418],{"class":251,"line":105},[249,417,255],{"class":254},[249,419,259],{"class":258},[249,421,422],{"class":251,"line":111},[249,423,424],{"class":264},"  \u002F* =============== TYPOGRAPHY =============== *\u002F\n",[249,426,427],{"class":251,"line":117},[249,428,429],{"class":270},"  --text-heading-1: 4.25rem;\n",[249,431,432],{"class":251,"line":123},[249,433,434],{"class":270},"  --text-heading-1--line-height: 110%;\n",[249,436,437],{"class":251,"line":129},[249,438,439],{"class":270},"  --text-heading-2: 3.25rem;\n",[249,441,442],{"class":251,"line":135},[249,443,444],{"class":270},"  --text-heading-2--line-height: 120%;\n",[249,446,447],{"class":251,"line":185},[249,448,449],{"class":270},"  --text-heading-3: 2.5rem;\n",[249,451,452],{"class":251,"line":329},[249,453,454],{"class":270},"  --text-heading-3--line-height: 120%;\n",[249,456,457],{"class":251,"line":340},[249,458,459],{"class":270},"  --text-heading-4: 2rem;\n",[249,461,462],{"class":251,"line":351},[249,463,464],{"class":270},"  --text-heading-4--line-height: 130%;\n",[249,466,468],{"class":251,"line":467},11,[249,469,470],{"class":270},"  --text-heading-5: 1.5rem;\n",[249,472,474],{"class":251,"line":473},12,[249,475,476],{"class":270},"  --text-heading-5--line-height: 140%;\n",[249,478,480],{"class":251,"line":479},13,[249,481,482],{"class":270},"  --text-heading-6: 1.25rem;\n",[249,484,486],{"class":251,"line":485},14,[249,487,488],{"class":270},"  --text-heading-6--line-height: 140%;\n",[249,490,492],{"class":251,"line":491},15,[249,493,494],{"class":270},"  --text-tagline-1: 1rem;\n",[249,496,498],{"class":251,"line":497},16,[249,499,500],{"class":270},"  --text-tagline-1--line-height: 150%;\n",[249,502,504],{"class":251,"line":503},17,[249,505,506],{"class":270},"  --text-tagline-2: 0.875rem;\n",[249,508,510],{"class":251,"line":509},18,[249,511,512],{"class":270},"  --text-tagline-2--line-height: 150%;\n",[249,514,516],{"class":251,"line":515},19,[249,517,518],{"class":270},"  --text-tagline-3: 0.75rem;\n",[249,520,522],{"class":251,"line":521},20,[249,523,524],{"class":270},"  --text-tagline-3--line-height: 150%;\n",[249,526,528],{"class":251,"line":527},21,[249,529,354],{"class":270},[531,532,533,536,537,540],"tip",{},[204,534,535],{},"1rem"," is typically 16px by default (so ",[204,538,539],{},"2rem"," is ~32px). Adjust both size and line-height for readability.",[542,543,544],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":245,"searchDepth":111,"depth":111,"links":546},[547,548],{"id":198,"depth":111,"text":199},{"id":399,"depth":111,"text":400},"Customize colors and typography by editing variables.","md",null,{},{"icon":116,"order":111},{"title":555,"description":556},"Next.js Customization Guide","Change colors and font sizes in the Next.js template.","DuuOY1BXSlOd1FcIftRGkbvRelEtCkeDRIn6p87L41g",[559,561],{"title":102,"path":142,"stem":143,"description":560,"icon":14,"order":105,"children":-1},"Install dependencies, run dev server, and build your Next.js project.",{"title":148,"path":149,"stem":150,"description":562,"icon":151,"order":117,"children":-1},"Create new pages using Next.js App Router in the NextSaaS project.",1781419802005]