{"id":686,"date":"2025-07-17T09:01:23","date_gmt":"2025-07-17T09:01:23","guid":{"rendered":"https:\/\/skemadigital.id\/blog\/?p=686"},"modified":"2025-07-17T09:01:24","modified_gmt":"2025-07-17T09:01:24","slug":"belajar-css-custom-properties","status":"publish","type":"post","link":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/","title":{"rendered":"Belajar CSS Custom Properties"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Kalau kamu sudah pernah ngulik-ngulik CSS, pasti pernah merasa kewalahan harus ganti warna atau ukuran font di banyak tempat sekaligus. Nah, ada kabar baik! Dengan CSS Custom Properties (alias CSS Variables), kamu bisa bikin styling yang lebih efisien, fleksibel, dan gampang diatur. Yuk, belajar CSS Custom Properties bareng-bareng dengan cara santai tapi tetap nendang secara teknis!<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_76 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#Apa_Itu_CSS_Custom_Properties\" >Apa Itu CSS Custom Properties?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#Kenapa_Harus_Belajar_CSS_Custom_Properties\" >Kenapa Harus Belajar CSS Custom Properties?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#1_Menetapkan_Variabel_CSS\" >1. Menetapkan Variabel CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#2_Menggunakan_Variabel_CSS\" >2. Menggunakan Variabel CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#3_Memberikan_Nilai_Cadangan_Fallback\" >3. Memberikan Nilai Cadangan (Fallback)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#4_Variabel_Dinamis_dengan_JavaScript\" >4. Variabel Dinamis dengan JavaScript<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#Penutup\" >Penutup<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Apa_Itu_CSS_Custom_Properties\"><\/span>Apa Itu CSS Custom Properties?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img alt=\"\" fetchpriority=\"high\" decoding=\"async\" width=\"521\" height=\"344\" src=\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/06\/Cuplikan-layar-2025-06-16-132913.jpeg\" alt=\"\" class=\"wp-image-452\" style=\"width:770px;height:auto\" srcset=\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/06\/Cuplikan-layar-2025-06-16-132913.jpeg 521w, https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/06\/Cuplikan-layar-2025-06-16-132913-300x198.jpeg 300w\" sizes=\"(max-width: 521px) 100vw, 521px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">CSS Custom Properties adalah fitur di CSS yang memungkinkan kita membuat variabel seperti di bahasa pemrograman lainnya. Dengan kata lain, kamu bisa mendeklarasikan sebuah nilai (misalnya warna atau ukuran) dalam satu tempat, lalu menggunakannya berkali-kali di mana saja dalam file CSS-mu.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Menguasai fitur seperti CSS Custom Properties bisa jadi nilai tambah besar buat kamu yang ingin jadi web developer handal. Lewat <a href=\"https:\/\/skemadigital.id\/blog\/sertifikasi-web-developer\/\"><strong>Sertifikasi Web Developer<\/strong>,<\/a> kamu akan belajar teknik-teknik penting dalam membangun website modern yang efisien, termasuk bagaimana menulis kode CSS yang rapi, fleksibel, dan mudah dikelola.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Contoh sederhana:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>:root {\n  --primary-color: #3498db;\n  --font-size-base: 16px;\n}\n\nbody {\n  color: var(--primary-color);\n  font-size: var(--font-size-base);\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Dengan begini, kalau suatu saat kamu ingin mengganti warna utama atau ukuran font dasar, kamu cukup ubah nilainya di satu tempat saja. Hemat waktu dan tenaga, kan?<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Kenapa_Harus_Belajar_CSS_Custom_Properties\"><\/span>Kenapa Harus Belajar CSS Custom Properties?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Ada banyak alasan kenapa kamu sebaiknya mulai belajar dan menerapkan CSS Custom Properties dalam proyek web-mu:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Memudahkan pemeliharaan<\/strong>: Mengubah tema warna atau layout jadi lebih simpel.<\/li>\n\n\n\n<li><strong>Lebih terstruktur<\/strong>: Styling lebih rapi dan konsisten.<\/li>\n\n\n\n<li><strong>Mendukung tema dinamis<\/strong>: Sangat berguna untuk dark mode atau fitur tema lainnya.<\/li>\n\n\n\n<li><strong>Interaktif dengan JavaScript<\/strong>: Kamu bisa mengubah nilai variabel dengan JavaScript secara real-time!<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Sekarang, mari kita telusuri lebih dalam tentang cara menggunakan dan mengelola CSS Custom Properties.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Menetapkan_Variabel_CSS\"><\/span>1. Menetapkan Variabel CSS<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Biasanya variabel dideklarasikan dalam <code>:root<\/code>, karena ini memungkinkan variabel tersebut digunakan di seluruh dokumen:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>:root {\n  --main-bg: #f0f0f0;\n  --text-color: #333;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Tapi kamu juga bisa menetapkan variabel dalam selector tertentu jika hanya ingin digunakan dalam scope itu saja.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Menggunakan_Variabel_CSS\"><\/span>2. Menggunakan Variabel CSS<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Setelah menetapkan, kamu bisa memanggil variabel menggunakan fungsi <code>var()<\/code>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>h1 {\n  color: var(--text-color);\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Memberikan_Nilai_Cadangan_Fallback\"><\/span>3. Memberikan Nilai Cadangan (Fallback)<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Kalau kamu khawatir variabel belum didefinisikan, kamu bisa tambahkan nilai fallback:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: var(--secondary-color, #666);\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Ini sangat membantu untuk menjaga styling tetap tampil meskipun variabel tidak tersedia.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Variabel_Dinamis_dengan_JavaScript\"><\/span>4. Variabel Dinamis dengan JavaScript<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Salah satu keunggulan besar CSS Variables dibanding preprocessor seperti SASS adalah: kamu bisa mengubah nilainya secara langsung dari JavaScript.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>document.documentElement.style.setProperty('--primary-color', '#e74c3c');<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Fitur ini sangat bermanfaat untuk membuat UI yang responsif terhadap interaksi pengguna, seperti mengubah tema warna dengan satu klik.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Penutup\"><\/span>Penutup<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">CSS Custom Properties bukan sekadar fitur tambahan\u2014ini adalah alat yang bisa mengubah cara kamu menulis CSS jadi lebih profesional dan scalable. Semakin kompleks proyek yang kamu kerjakan, semakin kamu akan merasakan manfaatnya.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Jadi, yuk mulai eksplorasi dan praktikkan CSS Custom Properties dalam proyekmu. Siapa tahu, ini jadi langkah awal menuju styling web yang lebih canggih dan menyenangkan!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kalau kamu sudah pernah ngulik-ngulik CSS, pasti pernah merasa kewalahan harus ganti warna atau ukuran font di banyak tempat sekaligus. Nah, ada kabar baik! Dengan CSS Custom Properties (alias CSS Variables), kamu bisa bikin styling yang lebih efisien, fleksibel, dan gampang diatur. Yuk, belajar CSS Custom Properties bareng-bareng dengan cara santai tapi tetap nendang secara [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":687,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_seopress_robots_primary_cat":"","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","footnotes":""},"categories":[50],"tags":[152],"class_list":["post-686","post","type-post","status-publish","format-standard","has-post-thumbnail","category-web-developer","tag-belajar-css-custom-properties"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Belajar CSS Custom Properties - skemadigital<\/title>\n<meta name=\"description\" content=\"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Belajar CSS Custom Properties - skemadigital\" \/>\n<meta property=\"og:description\" content=\"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/\" \/>\n<meta property=\"og:site_name\" content=\"skemadigital\" \/>\n<meta property=\"article:published_time\" content=\"2025-07-17T09:01:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-07-17T09:01:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/\",\"url\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/\",\"name\":\"Belajar CSS Custom Properties - skemadigital\",\"isPartOf\":{\"@id\":\"https:\/\/skemadigital.id\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png\",\"datePublished\":\"2025-07-17T09:01:23+00:00\",\"dateModified\":\"2025-07-17T09:01:24+00:00\",\"author\":{\"@id\":\"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/5c351368fdec08cbb5d185c956222162\"},\"description\":\"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!\",\"breadcrumb\":{\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage\",\"url\":\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png\",\"contentUrl\":\"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png\",\"width\":600,\"height\":400},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/skemadigital.id\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Belajar CSS Custom Properties\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/skemadigital.id\/blog\/#website\",\"url\":\"https:\/\/skemadigital.id\/blog\/\",\"name\":\"skemadigital\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/skemadigital.id\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/5c351368fdec08cbb5d185c956222162\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c3dcf6ac8dbcf6d7ff9d94e77a3d4678358491d700ca4e9e22887fb52fcd0009?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c3dcf6ac8dbcf6d7ff9d94e77a3d4678358491d700ca4e9e22887fb52fcd0009?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/skemadigital.id\"],\"url\":\"https:\/\/skemadigital.id\/blog\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Belajar CSS Custom Properties - skemadigital","description":"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/","og_locale":"en_US","og_type":"article","og_title":"Belajar CSS Custom Properties - skemadigital","og_description":"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!","og_url":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/","og_site_name":"skemadigital","article_published_time":"2025-07-17T09:01:23+00:00","article_modified_time":"2025-07-17T09:01:24+00:00","og_image":[{"width":600,"height":400,"url":"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png","type":"image\/png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"admin","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/","url":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/","name":"Belajar CSS Custom Properties - skemadigital","isPartOf":{"@id":"https:\/\/skemadigital.id\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage"},"image":{"@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage"},"thumbnailUrl":"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png","datePublished":"2025-07-17T09:01:23+00:00","dateModified":"2025-07-17T09:01:24+00:00","author":{"@id":"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/5c351368fdec08cbb5d185c956222162"},"description":"Yuk, mulai Belajar CSS Custom Properties biar styling websitemu lebih rapi, fleksibel, dan gampang diatur hanya dengan satu perubahan!","breadcrumb":{"@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#primaryimage","url":"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png","contentUrl":"https:\/\/skemadigital.id\/blog\/wp-content\/uploads\/2025\/07\/Tambahkan-judul-18-1.png","width":600,"height":400},{"@type":"BreadcrumbList","@id":"https:\/\/skemadigital.id\/blog\/belajar-css-custom-properties\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/skemadigital.id\/blog\/"},{"@type":"ListItem","position":2,"name":"Belajar CSS Custom Properties"}]},{"@type":"WebSite","@id":"https:\/\/skemadigital.id\/blog\/#website","url":"https:\/\/skemadigital.id\/blog\/","name":"skemadigital","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/skemadigital.id\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/5c351368fdec08cbb5d185c956222162","name":"admin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/skemadigital.id\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c3dcf6ac8dbcf6d7ff9d94e77a3d4678358491d700ca4e9e22887fb52fcd0009?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c3dcf6ac8dbcf6d7ff9d94e77a3d4678358491d700ca4e9e22887fb52fcd0009?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/skemadigital.id"],"url":"https:\/\/skemadigital.id\/blog\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/posts\/686","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/comments?post=686"}],"version-history":[{"count":1,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/posts\/686\/revisions"}],"predecessor-version":[{"id":688,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/posts\/686\/revisions\/688"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/media\/687"}],"wp:attachment":[{"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/media?parent=686"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/categories?post=686"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/skemadigital.id\/blog\/wp-json\/wp\/v2\/tags?post=686"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}