[Asm] 纯文本查看 复制代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>云颜文字 - 语义版</title>
<style>
:root { --primary: #6366f1; --glass: rgba(255, 255, 255, 0.1); }
body { margin: 0; padding: 20px; font-family: 'Microsoft YaHei', sans-serif; background: #0f172a; color: white; min-height: 100vh; display: flex; flex-direction: column; align-items: center; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 15px; width: 100%; max-width: 1200px; margin-top: 20px; }
.card {
background: var(--glass); backdrop-filter: blur(8px); padding: 15px; border-radius: 16px;
text-align: center; cursor: pointer; border: 1px solid rgba(255,255,255,0.1);
transition: 0.3s; display: flex; flex-direction: column; gap: 8px;
}
.card:hover { background: var(--primary); transform: translateY(-5px); }
.emoji { font-size: 1.4rem; }
.desc { font-size: 0.85rem; color: #cbd5e1; }
#toast { position: fixed; top: 20px; padding: 12px 24px; background: #22c55e; border-radius: 30px; display: none; }
</style>
</head>
<body>
<h1>☁️ 云颜文字语义库</h1>
<div class="grid" id="grid"></div>
<div id="toast">已复制到剪贴板！</div>
<script>
// 颜文字与对应的中文说明
const data = [
{v: "(｡♥‿♥｡)", d: "心动/花痴"}, {v: "(^・ω・^ )", d: "可爱/猫咪"}, {v: "(´・ω・`)", d: "委屈/无奈"},
{v: "ヽ(✿ﾟ▽ﾟ)ノ", d: "欢呼/开心"}, {v: "(╯°□°）╯", d: "掀桌/愤怒"}, {v: "(*^▽^*)", d: "大笑/阳光"},
{v: "(っ˘ڡ˘ς)", d: "馋嘴/好吃"}, {v: "(=^･ω･^=)", d: "软萌/卖萌"}, {v: "(T_T)", d: "大哭/伤心"},
{v: "(⌐■_■)", d: "深藏功名/酷"}, {v: "(つ﹏⊂)", d: "捂脸/害羞"}, {v: "(〃∀〃)", d: "脸红/害羞"},
{v: "Σ(°△°|||)", d: "惊吓/震惊"}, {v: "(´;ω;`)", d: "泪奔/难过"}, {v: "o(≧v≦)o", d: "兴奋/期待"},
{v: "ヾ(•ω•`)o", d: "挥手/再见"}, {v: "(~￣▽￣)~", d: "得瑟/愉悦"}, {v: "ψ(｀∇´)ψ", d: "坏笑/调皮"},
{v: "٩(◕‿◕)۶", d: "欢快/雀跃"}, {v: "ヽ(•ω•)ゞ", d: "敬礼/礼貌"}, {v: "(－‸ლ)", d: "无奈/扶额"},
{v: "(๑•̀ㅂ•́)و✧", d: "加油/打气"}, {v: "(=^-ω-^=)", d: "调皮/搞怪"}, {v: "(¬_¬)", d: "冷漠/看戏"},
{v: "(￣▽￣)/", d: "打招呼/嗨"}, {v: "(;´༎ຶД༎ຶ`)", d: "崩溃/痛哭"}, {v: "(╯▽╰)", d: "哼/傲娇"},
{v: "╮(╯▽╰)╭", d: "耸肩/无所谓"}, {v: "٩(๑>◡<๑)۶", d: "大满足/开心"}, {v: "૮(˶ᵔ ᵕ ᵔ˶)ა", d: "乖巧/可爱"},
{v: "(*￣3￣)╭", d: "飞吻/示爱"}, {v: "(￣▽￣)~*", d: "做梦/期待"}, {v: "(๑•̀ㅁ•́๑)✧", d: "坚定/自信"}
];
const grid = document.getElementById('grid');
const toast = document.getElementById('toast');
data.forEach(item => {
const div = document.createElement('div');
div.className = 'card';
div.innerHTML = `<span class="emoji">${item.v}</span><span class="desc">${item.d}</span>`;
div.onclick = () => {
navigator.clipboard.writeText(item.v);
toast.style.display = 'block';
setTimeout(() => toast.style.display = 'none', 1000);
};
grid.appendChild(div);
});
</script>
</body>
</html>
[复制链接]
发表于 2026-6-22 02:06
分享到朋友圈
