62 lines
2.2 KiB
HTML
62 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Favicon Generator</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: 20px;
|
|
}
|
|
.instructions {
|
|
background-color: #f0f2f5;
|
|
padding: 15px;
|
|
border-radius: 8px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.code {
|
|
background-color: #f1f1f1;
|
|
padding: 10px;
|
|
border-radius: 4px;
|
|
font-family: monospace;
|
|
white-space: pre-wrap;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>智能语音助手 - Favicon Generator</h1>
|
|
|
|
<div class="instructions">
|
|
<h2>Instructions</h2>
|
|
<p>To create a favicon for your project, you can use one of these methods:</p>
|
|
|
|
<h3>Option 1: Use an online favicon generator</h3>
|
|
<ol>
|
|
<li>Visit <a href="https://favicon.io/" target="_blank">favicon.io</a> or <a href="https://realfavicongenerator.net/" target="_blank">realfavicongenerator.net</a></li>
|
|
<li>Create your favicon (you can use text, an image, or an emoji)</li>
|
|
<li>Download the generated favicon.ico file</li>
|
|
<li>Place it in the public directory of your project</li>
|
|
</ol>
|
|
|
|
<h3>Option 2: Use a simple emoji favicon</h3>
|
|
<p>Create a file named favicon.svg in the public directory with the following content:</p>
|
|
<div class="code"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
|
<text y=".9em" font-size="90">🎤</text>
|
|
</svg></div>
|
|
<p>Then reference it in your index.html like this:</p>
|
|
<div class="code"><link rel="icon" href="/favicon.svg" type="image/svg+xml"></div>
|
|
|
|
<h3>Option 3: Use a pre-made favicon</h3>
|
|
<p>You can download a pre-made favicon from various icon libraries like:</p>
|
|
<ul>
|
|
<li><a href="https://www.flaticon.com/free-icons/microphone" target="_blank">Flaticon</a></li>
|
|
<li><a href="https://icons8.com/icons/set/microphone" target="_blank">Icons8</a></li>
|
|
<li><a href="https://iconscout.com/icons/microphone" target="_blank">IconScout</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<p>Once you have your favicon.ico file, place it in the public directory, and it will be automatically used by your application.</p>
|
|
</body>
|
|
</html>
|