{"id":14,"date":"2025-11-10T12:52:30","date_gmt":"2025-11-10T12:52:30","guid":{"rendered":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/?page_id=14"},"modified":"2025-12-02T07:45:53","modified_gmt":"2025-12-02T07:45:53","slug":"style-guide","status":"publish","type":"page","link":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/style-guide\/","title":{"rendered":"Style Guide"},"content":{"rendered":"<section class=\"bde-section-14-349 bde-section\">\n              \n  \n  \n\t\n\n  <div class=\"section-background-overlay\"><\/div>\n\n\n<div class=\"section-container\"><div class=\"bde-columns-14-350 bde-columns\"><div class=\"bde-column-14-351 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-352 bde-div\">\n  \n  \n\t\n\n\n\n<a class=\"bde-text-link-14-353 bde-text-link breakdance-link\" href=\"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\" target=\"_self\" data-type=\"url\">\n  Home\n\n<\/a><a class=\"bde-text-link-14-354 bde-text-link breakdance-link\" target=\"_self\" data-type=\"url\">\n  \/\n\n<\/a><a class=\"bde-text-link-14-355 bde-text-link breakdance-link\" target=\"_self\" data-type=\"url\">\n  Style Guide\n\n<\/a>\n<\/div><h2 class=\"bde-heading-14-356 bde-heading bde-preset-750eadb0-cb50-435f-8ed2-e91406e8ac06\">\nStyle Guide\n<\/h2><div class=\"bde-text-14-357 bde-text\">\nStandards and guidelines of this template.\n<\/div>\n<\/div><\/div><\/div>\n<\/section><section class=\"bde-section-14-104 bde-section\">\n  \n  \n\t\n\n\n\n<div class=\"section-container\"><div class=\"bde-columns-14-105 bde-columns\"><div class=\"bde-column-14-106 bde-column\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-110 bde-heading\">\nTheme style\n<\/h3><div class=\"bde-button-14-151 bde-button\">\n        \n    \n    \n    \n    \n            \n                    \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link button-atom button-atom--custom bde-button__button\" href=\"#Color\" target=\"_self\" data-type=\"url\"  >\n\n    \n        <span class=\"button-atom__text\">Color<\/span>\n\n        \n        \n                <\/a>\n\n    \n\n\n<\/div><div class=\"bde-button-14-152 bde-button\">\n        \n    \n    \n    \n    \n            \n                    \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link button-atom button-atom--custom bde-button__button\" href=\"#Typography\" target=\"_self\" data-type=\"url\"  >\n\n    \n        <span class=\"button-atom__text\">Typography<\/span>\n\n        \n        \n                <\/a>\n\n    \n\n\n<\/div><div class=\"bde-button-14-153 bde-button\">\n        \n    \n    \n    \n    \n            \n                    \n            \n            \n\n    \n    \n    \n    \n    \n    <a class=\"breakdance-link button-atom button-atom--custom bde-button__button\" href=\"#Button\" target=\"_self\" data-type=\"url\"  >\n\n    \n        <span class=\"button-atom__text\">Button<\/span>\n\n        \n        \n                <\/a>\n\n    \n\n\n<\/div>\n<\/div><div class=\"bde-column-14-107 bde-column\">\n  \n  \n\t\n\n\n\n<h3 id=\"Color\" class=\"bde-heading-14-111 bde-heading\">\nColor style\n<\/h3><div class=\"bde-fancy-divider-14-112 bde-fancy-divider\">\n\n\n<div class=\"bde-fancy-divider__wrapper\">\n  <div class=\"bde-fancy-divider__separator   \">\n  \t  <\/div>\n<\/div>\n\n<\/div><div class=\"bde-columns-14-113 bde-columns\"><div class=\"bde-column-14-114 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-117 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-119 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-118 bde-heading\">\nWhitesmoke\n<\/h3><div class=\"bde-text-14-120 bde-text\">\n#F5F5F5\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-121 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-122 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-123 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-124 bde-heading\">\nWhite\n<\/h3><div class=\"bde-text-14-125 bde-text\">\n#FFFFFF\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-131 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-132 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-133 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-134 bde-heading\">\nBlack\n<\/h3><div class=\"bde-text-14-135 bde-text\">\n#000\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-126 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-127 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-128 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-129 bde-heading\">\nText color\n<\/h3><div class=\"bde-text-14-130 bde-text\">\n#666\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-136 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-137 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-138 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-139 bde-heading\">\nDark Green\n<\/h3><div class=\"bde-text-14-140 bde-text\">\n#1c4d20\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-146 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-147 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-148 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-149 bde-heading\">\nlight yellow-green shade\n<\/h3><div class=\"bde-text-14-150 bde-text\">\n#acd167\n<\/div>\n<\/div>\n<\/div><div class=\"bde-column-14-141 bde-column\">\n  \n  \n\t\n\n\n\n<div class=\"bde-div-14-142 bde-div\">\n  \n  \n\t\n\n\n\n\n<\/div><div class=\"bde-div-14-143 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-144 bde-heading\">\nMint Cream\n<\/h3><div class=\"bde-text-14-145 bde-text\">\n#f5f8f2\n<\/div>\n<\/div>\n<\/div><\/div><h3 id=\"Typography\" class=\"bde-heading-14-154 bde-heading\">\nTypography style\n<\/h3><div class=\"bde-fancy-divider-14-155 bde-fancy-divider\">\n\n\n<div class=\"bde-fancy-divider__wrapper\">\n  <div class=\"bde-fancy-divider__separator   \">\n  \t  <\/div>\n<\/div>\n\n<\/div><h1 class=\"bde-heading-14-326 bde-heading\">\nH1 - Aa\n<\/h1><h1 class=\"bde-heading-14-327 bde-heading\">\nBb Cc\n<\/h1><div class=\"bde-div-14-328 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-329 bde-heading\">\nHeading 1\n<\/h3><h3 class=\"bde-heading-14-330 bde-heading\">\nSofia Sans Condensed - 700 Medium\n<\/h3><h3 class=\"bde-heading-14-331 bde-heading\">\nSize 130px\n<\/h3><h3 class=\"bde-heading-14-332 bde-heading\">\nHeight 1.0 EM\n<\/h3>\n<\/div><div class=\"bde-fancy-divider-14-333 bde-fancy-divider\">\n\n\n<div class=\"bde-fancy-divider__wrapper\">\n  <div class=\"bde-fancy-divider__separator   \">\n  \t  <\/div>\n<\/div>\n\n<\/div><h3 class=\"bde-heading-14-337 bde-heading\">\nRich text typography\n<\/h3><div class=\"bde-fancy-divider-14-338 bde-fancy-divider\">\n\n\n<div class=\"bde-fancy-divider__wrapper\">\n  <div class=\"bde-fancy-divider__separator   \">\n  \t  <\/div>\n<\/div>\n\n<\/div><div class=\"bde-rich-text-14-335 bde-rich-text breakdance-rich-text-styles\">\n<h1>H1<\/h1>\n<h2>H2<\/h2>\n<h3>H3<\/h3>\n<h4>H4<\/h4>\n<h5>H5<\/h5>\n<h6>H6<\/h6>\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore\n    magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo\n    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n    pariatur.<\/p>\n<blockquote>Block quote<\/blockquote>\n<p>Ordered list<\/p>\n<ol role=\"list\" class=\"list\">\n    <li>Item 1<\/li>\n    <li>Item 2<\/li>\n    <li>Item 3<\/li>\n<\/ol>\n<p>Unordered list<\/p>\n<ul role=\"list\">\n    <li>Item A<\/li>\n    <li>Item B<\/li>\n    <li>Item C<\/li>\n<\/ul>\n<p><a href=\"https:\/\/bdtemplatehub.com\/breakdance-nft-layouts-pack\/style-guide\/\">Text link<\/a><\/p>\n<p><strong>Bold text<\/strong><\/p>\n<p><em>Emphasis<\/em><\/p>\n<p><sup>Superscript<\/sup><\/p>\n<p><sub>Subscript<\/sub><\/p>\n\n<\/div><h3 id=\"Button\" class=\"bde-heading-14-339 bde-heading\">\nButton\n<\/h3><div class=\"bde-fancy-divider-14-340 bde-fancy-divider\">\n\n\n<div class=\"bde-fancy-divider__wrapper\">\n  <div class=\"bde-fancy-divider__separator   \">\n  \t  <\/div>\n<\/div>\n\n<\/div><div class=\"bde-div-14-344 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-341 bde-heading\">\nPrimary Button\n<\/h3><div class=\"bde-button-14-343 bde-button\">\n        \n    \n    \n    \n    \n            \n            <button type=\"button\" class=\"button-atom button-atom--primary bde-button__button\"  >\n    \n        <span class=\"button-atom__text\">Button text<\/span>\n\n        \n        \n            <\/button>\n    \n\n\n<\/div>\n<\/div><div class=\"bde-div-14-345 bde-div\">\n  \n  \n\t\n\n\n\n<h3 class=\"bde-heading-14-346 bde-heading\">\nSecondary Button\n<\/h3><div class=\"bde-button-14-348 bde-button\">\n        \n    \n    \n    \n    \n            \n            <button type=\"button\" class=\"button-atom button-atom--secondary bde-button__button\"  >\n    \n        <span class=\"button-atom__text\">Button text<\/span>\n\n        \n        \n            <\/button>\n    \n\n\n<\/div>\n<\/div>\n<\/div><\/div><\/div>\n<\/section>","protected":false},"excerpt":{"rendered":"<p>Home \/ Style Guide Style Guide Standards and guidelines of this template. Theme style Color Typography Button Color style Whitesmoke #F5F5F5 White #FFFFFF Black #000 Text color #666 Dark Green #1c4d20 light yellow-green shade #acd167 Mint Cream #f5f8f2 Typography style H1 &#8211; Aa Bb Cc Heading 1 Sofia Sans Condensed &#8211; 700 Medium Size 130px [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_breakdance_hide_in_design_set":false,"_breakdance_tags":"","footnotes":""},"class_list":["post-14","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/pages\/14","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/comments?post=14"}],"version-history":[{"count":0,"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/pages\/14\/revisions"}],"wp:attachment":[{"href":"https:\/\/bdwebkit.com\/breakdance-herbal-and-tea-shop-layouts-pack\/wp-json\/wp\/v2\/media?parent=14"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}