• Stars
    star
    555
  • Rank 80,213 (Top 2 %)
  • Language
    CSS
  • License
    MIT License
  • Created almost 9 years ago
  • Updated 5 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

👀 The fastest and most intuitive way to build diverse websites and progressive web application interfaces.

Tocas UI

以最快最直覺的方式,建構多樣的網站與漸進式網路應用程式介面。

 

📀 開始使用!

只需要將下列 HTML 標籤複製至你的 <head>...</head> 網頁段落就可以開工了 🔥

<!-- 核心:Tocas UI -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocas/4.2.4/tocas.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/tocas/4.2.4/tocas.min.js"></script>

<!-- 字體:Noto Sans TC -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700&display=swap" rel="stylesheet" />

 

或者…自行下載 Tocas UI

下載 /dist 資料夾並像下面這樣引用 Tocas UI 檔案,這樣你便能在離線環境使用 Tocas UI。

<link rel="stylesheet" href="./tocas/dist/tocas.min.css" />
<script src="./tocas/dist/tocas.min.js"></script>

 

🚀 範例程式碼

<!-- 按鈕 -->
<button class="ts-button">按鈕</button>

<!-- 標題 -->
<div class="ts-header">標題</div>

<!-- 輸入欄位 -->
<div class="ts-input">
    <input type="text" placeholder="搜尋…" />
</div>

 

❤️ 來自台灣的愛心

٩(ˊᗜˋ*)و 由來自 🇹🇼 台灣的 Yami Odymel 所設計,當然還有貢獻者們的愛心 ❤️。原始碼授權方式為 MIT,文件則為 CC 0 公眾領域。還請盡情地使用、分享或一同改進。Tocas UI 是卡莉絲伊繁星的設計語言,而卡莉絲伊繁星屬對空音商事