mesmer-logo / index.html
mesmertech's picture
Deploy static space build
0bc2c6b verified
Raw
History Blame Contribute Delete
2.6 kB
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Free AI Logo Maker — Generate a Brand Logo From Text</title>
<meta name="description" content="Free AI logo maker: describe your brand and get an AI-generated logo in seconds. A logo generator from text — pick a style, choose a color mood, and download AI logo design. No signup." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="./shared/ui.css" />
<style>
/* Tool-specific touches layered on top of the shared theme. */
.ms-chips {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 10px;
}
.ms-chip {
text-align: left;
padding: 12px 14px;
border: 1px solid var(--border);
border-radius: 10px;
background: var(--bg-elevated);
color: var(--text-primary);
font-family: inherit;
cursor: pointer;
transition: border-color 0.15s, background 0.15s;
}
.ms-chip:hover { border-color: var(--border-hover); }
.ms-chip.is-selected { border-color: var(--amber); background: var(--amber-dim); }
.ms-chip:focus-visible { outline: none; border-color: var(--amber); box-shadow: 0 0 0 3px var(--amber-dim); }
.ms-chip-name { display: block; font-weight: 700; font-size: 14px; }
.ms-chip-desc { display: block; margin-top: 3px; font-size: 12px; color: var(--text-secondary); }
.ms-prompt-details {
margin-top: 14px;
border: 1px solid var(--border);
border-radius: 8px;
background: var(--bg-elevated);
}
.ms-prompt-details summary {
padding: 10px 14px;
cursor: pointer;
font-size: 13px;
font-weight: 600;
color: var(--text-secondary);
list-style: none;
}
.ms-prompt-details summary::-webkit-details-marker { display: none; }
.ms-prompt-details summary::before { content: "▸ "; color: var(--amber); }
.ms-prompt-details[open] summary::before { content: "▾ "; }
.ms-prompt-details .ms-meta { margin: 0; padding: 0 14px 14px; line-height: 1.55; }
.ms-brand-name-result { margin: 0 0 2px; font-size: 16px; font-weight: 700; color: var(--text-primary); }
.ms-api-note { margin-top: 14px; font-size: 12.5px; color: var(--text-muted); }
</style>
</head>
<body>
<div id="app"></div>
<script type="module" src="./app.js"></script>
</body>
</html>