Calculator Tools Calculator Tools
Create

Holographic QR Code Generator

Apr 10, 2026

About this app

Create and animate holographic QR codes with a premium shimmering overlay. Perfect for events and modern marketing.

Map & Wallet Generator Voice Controlled Map & Ethereum Wallet Generator ⬆️ Up (W) ⬅️ Left (A) ⬇️ Down (S) ➡️ Right (D) 🎟️ Generate Wallet

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Map & Wallet Generator</title>
<meta name="description" content="Wind your way through a delightful voice-controlled map while generating an Ethereum wallet. W, A, S, D keys move the map, and friendly guidance keeps you on track!">
<meta name="keywords" content="Map, GPS, Voice Control, Wallet Generator, Ethereum, Leaflet, Web App">

<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/annyang/2.6.1/annyang.min.js"></script>

<style>
body {
margin: 0;
background: linear-gradient(120deg, #84fab0, #8fd3f4);
font-family: 'Roboto', sans-serif;
color: #333;
display: flex;
flex-direction: column;
align-items: center;
}
#map {
height: 80vh;
width: 100vw;
}
#controls {
margin: 20px;
font-size: 20px;
}
button {
margin: 5px;
padding: 10px 20px;
border-radius: 5px;
border: none;
background-color: #4CAF50;
color: white;
cursor: pointer;
transition: background-color 0.3s;
}
button:hover {
background-color: #45a049;
}
h1 {
margin: 20px;
color: #ffffff;
text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}
</style>

<script>
let map, marker, lat = 51.505, lng = -0.09;

function initMap() {
map = L.map('map').setView([lat, lng], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
}).addTo(map);

marker = L.marker([lat, lng]).addTo(map);
}

function moveMap(direction) {
const step = 0.01; // degrees
switch(direction) {
case 'w': lat += step; break;
case 's': lat -= step; break;
case 'a': lng -= step; break;
case 'd': lng += step; break;
}
map.setView([lat, lng], 13);
marker.setLatLng([lat, lng]);
}

function generateWallet() {
const wallet = `0x${Math.random().toString(16).slice(2, 42)}`;
alert("Generated Wallet Address: " + wallet);
}

function voiceControl() {
const commands = {
'move forward': () => moveMap('w'),
'move backward': () => moveMap('s'),
'move left': () => moveMap('a'),
'move right': () => moveMap('d'),
'generate wallet': generateWallet
};

if (annyang) {
annyang.addCommands(commands);
annyang.start();
}
}

document.addEventListener('DOMContentLoaded', () => {
initMap();
voiceControl();
});
</script>
</head>
<body>
<h1>Voice Controlled Map & Ethereum Wallet Generator</h1>
<div id="map"></div>
<div id="controls">
<button onclick="moveMap('w')">⬆️ Up (W)</button>
<button onclick="moveMap('a')">⬅️ Left (A)</button>
<button onclick="moveMap('s')">⬇️ Down (S)</button>
<button onclick="moveMap('d')">➡️ Right (D)</button>
<button onclick="generateWallet()">🎟️ Generate Wallet</button>
</div>
</body>
</html>