index.html

<!DOCTYPE html>
<html lang="en">

<head>

    <style>
    @import url('https://fonts.googleapis.com/css2?family=Oswald&family=Roboto+Mono:wght@300&display=swap');
    </style>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MORSE CODE CONVERTER</title>
    <script src="script.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <h1>MORSE CODE CONVERTER</h1>

    <div id="converter">
        <textarea id="inputText" placeholder="Enter text here..."></textarea>
        <button id="convertToMorse">Convert to Morse Code</button>
        <textarea id="outputMorse" placeholder="Morse Code will appear here..."></textarea>
    </div>

    <h1>TEXT CONVERTER</h1>

    <div id="converter1">
        <textarea id="inputMorse" placeholder="Enter Morse Code here..."></textarea>
        <button id="convertToText">Convert to text</button>
        <textarea id="outputText" placeholder="Text will appear here..."></textarea>
    </div>


</body>

</html>