使い道のないアルファベット変換ツール
- yokowax0621
- 2024年11月18日
- 読了時間: 2分
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>アルファベット変換ツール</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
textarea, input[type="text"] {
width: 100%;
margin: 10px 0;
padding: 10px;
font-size: 16px;
}
.output {
font-size: 20px;
font-family: "Segoe UI", sans-serif;
}
</style>
</head>
<body>
<h1>アルファベット変換ツール</h1>
<p>以下にアルファベットを入力してください。ゴシック風に変換されます。</p>
<textarea id="inputText" rows="5" placeholder="アルファベットを入力..."></textarea>
<div class="output" id="outputText"></div>
<script>
const gothicAlphabet = {
A: "𝔸", B: "𝔹", C: "ℂ", D: "𝔻", E: "𝔼", F: "𝔽", G: "𝔾",
H: "ℍ", I: "𝕀", J: "𝕁", K: "𝕂", L: "𝕃", M: "𝕄", N: "ℕ",
O: "𝕆", P: "ℙ", Q: "ℚ", R: "ℝ", S: "𝕊", T: "𝕋", U: "𝕌",
V: "𝕍", W: "𝕎", X: "𝕏", Y: "𝕐", Z: "ℤ",
a: "𝔸", b: "𝔹", c: "ℂ", d: "𝔻", e: "𝔼", f: "𝔽", g: "𝔾",
h: "ℍ", i: "𝕀", j: "𝕁", k: "𝕂", l: "𝕃", m: "𝕄", n: "ℕ",
o: "𝕆", p: "ℙ", q: "ℚ", r: "ℝ", s: "𝕊", t: "𝕋", u: "𝕌",
v: "𝕍", w: "𝕎", x: "𝕏", y: "𝕐", z: "ℤ"
};
document.getElementById("inputText").addEventListener("input", function () {
const input = this.value;
const converted = input.split("").map(char => gothicAlphabet[char] || char).join("");
document.getElementById("outputText").textContent = converted;
});
</script>
</body>
</html>
をメモ帳にコピーして、保存するときに拡張子を.htmlにします。
そしたらつかえます。
どのようなものになっているかというと、
このように、𝕏(旧Twitter)のアイコンの文字のフォントになります。
暇であれば試してみてください。
Comments