<!DOCTYPE html>

<html>

<head>

<title>Fancy Text Generator Tool</title>

<style>

body {

font-family: Arial, sans-serif;

background-color: #f2f2f2;

padding: 20px;

}


h1 {

text-align: center;

margin-bottom: 20px;

}


form {

display: flex;

flex-direction: column;

margin-bottom: 20px;

}


label {

margin-bottom: 10px;

}


input {

padding: 10px;

border: none;

border-radius: 5px;

margin-bottom: 10px;

}


button {

padding: 10px;

border: none;

border-radius: 5px;

background-color: #4CAF50;

color: #fff;

cursor: pointer;

}


#output {

margin-top: 20px;

font-size: 24px;

font-weight: bold;

text-align: center;

}


</style>

</head>

<body>

<h1>Fancy Text Generator Tool</h1>

<form>

<label for="text">Enter Text:</label>

<input type="text" id="text" name="text" placeholder="Enter your text here...">

<button type="button" onclick="generate()">Generate</button>

</form>

<div id="output"></div>


<script >

function generate() {

let input = document.getElementById("text").value;

let output = document.getElementById("output");


let fancyText = "";


for(let i = 0; i < input.length; i++) {

switch(input.charAt(i)) {

case "a":

fancyText += "𝓪";

break;

case "b":

fancyText += "𝓫";

break;

case "c":

fancyText += "𝓬";

break;

case "d":

fancyText += "𝓭";

break;

case "e":

fancyText += "𝓮";

break;

case "f":

fancyText += "𝓯";

break;

case "g":

fancyText += "𝓰";

break;

case "h":

fancyText += "𝓱";

break;

case "i":

fancyText += "𝓲";

break;

case "j":

fancyText += "𝓳";

break;

case "k":

fancyText += "𝓴";

break;

case "l":

fancyText += "𝓵";

break;

case "m":

fancyText += "𝓶";

break;

case "n":

fancyText += "𝓷";

break;

case "o":

fancyText += "𝓸";

break;

case "p":

fancyText += "𝓹";

break;

case "q":

fancyText += "𝓺";

break;

case "r":

fancyText += "𝓻";

break;

case "s":

fancyText += "𝓼";

break;

case "t":

fancyText += "𝓽";

break;

case "u":

fancyText += "𝓾";

break;

case "v":

fancyText += "𝓿";

break;

case "w":

fancyText += "𝔀";

break;

case "x":

fancyText += "𝔁";

break;

case "y":

fancyText += "𝔂";

break;

case "z":

fancyText += "𝔃";

break;

case " ":

fancyText += " ";

break;

default:

fancyText += input.charAt(i);

break;

}

}


output.innerHTML = fancyText;

}


</script>

</body>

</html>


Comments