{"id":11428,"date":"2026-03-01T16:47:59","date_gmt":"2026-03-01T07:47:59","guid":{"rendered":"https:\/\/www.skyer9.pe.kr\/wordpress\/?p=11428"},"modified":"2026-03-04T16:53:22","modified_gmt":"2026-03-04T07:53:22","slug":"google-material-symbols-vuejs-%ed%94%84%eb%a1%9c%ec%a0%9d%ed%8a%b8%ec%97%90-%ec%a0%81%ec%9a%a9%ed%95%98%ea%b8%b0","status":"publish","type":"post","link":"https:\/\/www.skyer9.pe.kr\/wordpress\/?p=11428","title":{"rendered":"Google Material Symbols VueJS \ud504\ub85c\uc81d\ud2b8\uc5d0 \uc801\uc6a9\ud558\uae30"},"content":{"rendered":"<h1>Google Material Symbols VueJS \ud504\ub85c\uc81d\ud2b8\uc5d0 \uc801\uc6a9\ud558\uae30<\/h1>\n<h2>\uc544\uc774\ucf58 \ub2e4\uc6b4\ub85c\ub4dc<\/h2>\n<p><a href=\"https:\/\/fonts.google.com\/icons\">\uc5ec\uae30<\/a> \uc5d0\uc11c \ud3f0\ud2b8\ub97c \ub2e4\uc6b4\ubc1b\uc2b5\ub2c8\ub2e4.<\/p>\n<h2>\ud504\ub85c\uc81d\ud2b8\uc5d0 \ud3f0\ud2b8 \ucd94\uac00<\/h2>\n<pre><code class=\"language-text\">my-project\/\n\u251c\u2500\u2500 src\/\n\u2502   \u251c\u2500\u2500 assets\/\n\u2502   \u2502   \u251c\u2500\u2500 fonts\/\n\u2502   \u2502   \u2502   \u2514\u2500\u2500 MaterialSymbolsRounded_48pt-Regular.ttf\n\u2502   \u2502   \u2514\u2500\u2500 main.css\n\u2502   \u2514\u2500\u2500 App.vue<\/code><\/pre>\n<pre><code class=\"language-css\">\/* src\/assets\/main.css *\/\n\n@font-face {\n  font-family: &#039;Material Symbols Rounded&#039;;\n  src: url(&#039;@\/assets\/fonts\/MaterialSymbolsRounded_48pt-Regular.ttf&#039;) format(&#039;truetype&#039;);\n  font-weight: normal;\n  font-style: normal;\n}\n\n\/* \uc544\uc774\ucf58 \uc0ac\uc6a9\uc744 \uc704\ud55c \uacf5\ud1b5 \ud074\ub798\uc2a4 \uc815\uc758 *\/\n.material-symbols-rounded {\n  font-family: &#039;Material Symbols Rounded&#039;;\n  font-weight: normal;\n  font-style: normal;\n  font-size: 24px;  \/* \uae30\ubcf8 \ud06c\uae30 *\/\n  display: inline-block;\n  line-height: 1;\n  text-transform: none;\n  letter-spacing: normal;\n  word-wrap: normal;\n  white-space: nowrap;\n  direction: ltr;\n\n  \/* \ub80c\ub354\ub9c1 \ucd5c\uc801\ud654 *\/\n  -webkit-font-smoothing: antialiased;\n}<\/code><\/pre>\n<h2>\uc544\uc774\ucf58 \uc0ac\uc6a9<\/h2>\n<pre><code class=\"language-html\">&lt;template&gt;\n  &lt;div class=&quot;menu&quot;&gt;\n    &lt;span class=&quot;material-symbols-rounded&quot;&gt;search&lt;\/span&gt;\n    &lt;span&gt;\uac80\uc0c9&lt;\/span&gt;\n  &lt;\/div&gt;\n&lt;\/template&gt;<\/code><\/pre>\n<h2>\uc791\ub3d9\uc6d0\ub9ac<\/h2>\n<p>\ud3f0\ud2b8 \ud30c\uc77c \ub0b4\ubd80\uc801\uc73c\ub85c &#8216;search&#8217;\ub77c\ub294 \ud14d\uc2a4\ud2b8\ub97c \uc785\ub825\ud558\uba74 \ud2b9\uc815 \ubaa8\uc591(\ub3cb\ubcf4\uae30 \uc544\uc774\ucf58)\uc73c\ub85c \uce58\ud658\ud558\ub3c4\ub85d \ub9e4\ud551\ub418\uc5b4 \uc788\uae30 \ub54c\ubb38.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Google Material Symbols VueJS \ud504\ub85c\uc81d\ud2b8\uc5d0 \uc801\uc6a9\ud558\uae30 \uc544\uc774\ucf58 \ub2e4\uc6b4\ub85c\ub4dc \uc5ec\uae30 \uc5d0\uc11c \ud3f0\ud2b8\ub97c \ub2e4\uc6b4\ubc1b\uc2b5\ub2c8\ub2e4. \ud504\ub85c\uc81d\ud2b8\uc5d0 \ud3f0\ud2b8 \ucd94\uac00 my-project\/ \u251c\u2500\u2500 src\/ \u2502 \u251c\u2500\u2500 assets\/ \u2502 \u2502 \u251c\u2500\u2500 fonts\/ \u2502 \u2502 \u2502 \u2514\u2500\u2500 MaterialSymbolsRounded_48pt-Regular.ttf \u2502 \u2502 \u2514\u2500\u2500 main.css \u2502 \u2514\u2500\u2500 App.vue \/* src\/assets\/main.css *\/ @font-face { font-family: &#039;Material Symbols Rounded&#039;; src: url(&#039;@\/assets\/fonts\/MaterialSymbolsRounded_48pt-Regular.ttf&#039;) format(&#039;truetype&#039;); font-weight: normal; font-style: normal; } \/*\u2026 <span class=\"read-more\"><a href=\"https:\/\/www.skyer9.pe.kr\/wordpress\/?p=11428\">Read More &raquo;<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-11428","post","type-post","status-publish","format-standard","hentry","category-spring-boot"],"_links":{"self":[{"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11428","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=11428"}],"version-history":[{"count":1,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11428\/revisions"}],"predecessor-version":[{"id":11429,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=\/wp\/v2\/posts\/11428\/revisions\/11429"}],"wp:attachment":[{"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=11428"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=11428"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.skyer9.pe.kr\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=11428"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}