<body data-ready="false">
<span>nano</span>
<span class="data-error" id="nano-error" data-error=""></span>
<div class="data-container">
<label for="prompt">question</label>
<textarea type="text" id="ask-question" name="prompt"></textarea>
<button id="ask-button" class="ask-button">ask</button>
</div>
<div class="data-container">
<label for="ask-response">response</label>
<zero-md name="ask-response">
<template data-append>
<style>
.markdown-body {
padding: 1rem;
border-radius: 0.25rem;
}
</style>
</template>
<script type="text/markdown" id="ask-response"></script>
</zero-md>
</div>
<div class="help-container" id="how-to" data-help="false">
<label for="ask-response">help</label>
<zero-md name="ask-response">
<template data-append>
<style>
.markdown-body {
padding: 1rem;
border-radius: 0.25rem;
}
</style>
</template>
<script type="text/markdown" id="help-response">
This is nano, a proof-of-concept built on top of Chrome's embedded gemini LLM.
It is entirely offline and written in one JS / HTML file.
To try it out, you need to:
* be on Mac or Windows
* be on Chrome [dev](https://www.google.com/chrome/dev/) / [canary](https://www.google.com/chrome/canary/) (version >= 127)
* enable `chrome://flags/#optimization-guide-on-device-model` (set to **Enabled BypassPerfRequirement**)
* enable `chrome://flags/#prompt-api-for-gemini-nano` (set to **Enabled**)
* re-launch Chrome and revisit page
* if this fails, try `chrome://components` and look for **On Device Model**
* this should have a version which is not `0.0.0.0` -- you can bang on the update button if you'd like (don't bang too hard)
* eventually this will have the right value (after downloading the model), then you'll need to relaunch chrome and try again
</script>
</zero-md>
</div>
</body>
