An AI toolkit and prompt book that helps people get better results from AI.
Designed, built and run end to end by one person: the product, the tools, the extension, the admin and the data.
The full source is available to academic reviewers. Send a short email with your GitHub username and I will add you as a collaborator with read access.
AI tools are only as good as the instructions they are given, and most people were never taught how to write them. The result is generic answers, wasted money and a lot of trial and error.
Cuelara starts from the problem the person actually has, in their own words, and puts the right tool in front of them. It is not one tool. It is a growing toolkit, a library of ready-made prompts, a browser extension and an API, behind one guided experience.
These are the everyday frustrations people have when they use AI, and what Cuelara does about each one.
| What people say about AI | What is really behind it | How Cuelara helps |
|---|---|---|
| "It keeps giving me generic answers." | The prompt is vague or missing key details. | Prompt Optimizer rewrites it with a clear role, steps and format. |
| "It ignores half of what I asked." | The instructions conflict or can be read two ways. | Prompt Debugger finds each flaw and shows how to fix it. |
| "I do not know how to ask for this." | Knowing what you want is not the same as knowing how to phrase it. | Prompt Builder turns a rough idea into a complete prompt. |
| "I always start from a blank page." | Every task begins from zero. | Prompt book and Template Generator give ready-made prompts to fill in. |
| "The answer comes back messy." | The prompt never said what the answer should look like. | Prompt Formatter gives the prompt a clear structure, and the Builder adds the output format. |
| "I cannot tell if my prompt is any good." | You only find out after you have sent it. | Intelligence Score grades it before you send it and says what to improve. |
| "My document is too big to paste." | AI cannot take the whole file, and long pastes lead to mistakes. | Context Extractor, built on RAG (retrieval-augmented generation), finds the relevant parts and hands you just those. |
flowchart TB
subgraph PEOPLE["Who uses it"]
P1["Everyday AI users"]:::in
P2["Developers and builders"]:::in
P3["Teams"]:::in
end
subgraph ENTRY["Ways in"]
E1["The website"]:::in
E2["Browser extension<br/>inside ChatGPT, Claude, Gemini"]:::in
E3["MCP server and API<br/>for Claude, Cursor and apps"]:::in
end
subgraph CORE["The product"]
direction TB
H["Guided start<br/>describe your problem,<br/>get the right tool"]:::ai
T["Toolkit<br/>build, fix, save tokens,<br/>add context with RAG"]:::ai
B["Prompt book<br/>ready-made prompts<br/>and an editor"]:::ai
end
subgraph ACCOUNT["Accounts and plans"]
A1["History and<br/>saved prompts"]:::out
A2["Free and paid plans<br/>with daily limits"]:::out
A3["Team workspaces<br/>and a shared library"]:::out
end
subgraph ADMIN["Behind the scenes"]
D1["Admin back office<br/>tools, content, users, plans"]:::warn
D2["Database<br/>and AI services"]:::warn
end
P1 --> E1
P2 --> E2
P2 --> E3
P3 --> E1
E1 --> H
E2 --> T
E3 --> T
H --> T
H --> B
T --> A1
B --> A1
A1 --> A2
A2 --> A3
D1 --> T
D1 --> B
D2 --> T
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Light boxes are what visitors touch, purple is the guided and AI-powered core, green is what an account adds, amber is what runs behind the scenes.
A visitor types their problem, or picks a common situation. If they type, Cuelara uses text embeddings to match the meaning of their words to the right tool and to any ready-made prompts that fit. If they pick a situation, they go straight to the tools for it.
flowchart LR
A["Visitor describes a problem<br/>in plain words"]:::in --> B{{"Match by meaning<br/>using text embeddings"}}:::ai
A2["...or picks a<br/>common situation"]:::in --> T
B -->|"closest tool"| T["Best tool,<br/>runs on the same page"]:::out
B -->|"closest prompts"| P["Ready-made prompts<br/>that fit"]:::out
T --> R["Use the tool and<br/>get your results"]:::out
P --> R
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: this is embedding-based retrieval (the same idea as the retrieval half of RAG): every tool description and every prompt in the book is turned into a meaning fingerprint (an embedding) once. The visitor's sentence gets one on request and the closest meaning wins, so nothing depends on exact keywords.
Each tool is shown the same way: the pain it removes, the journey from input to result, and a line on how it works inside. The set of tools keeps growing; these are the current ones.
The pain: You know what you want from the AI, but not how to ask for it, so you stare at an empty box.
What you get: Describe the idea in plain words and get a complete, structured prompt, written the way your chosen AI likes to be asked. Try it live ↗
flowchart LR
A["Your idea<br/>in plain words"]:::in --> B["Pick the AI,<br/>the use case<br/>and the detail"]:::in
B --> C["Cuelara adds the writing<br/>rules for that AI"]:::ai
C --> D["AI drafts a structured<br/>prompt"]:::ai
D --> E["Ready-to-paste prompt"]:::out
E --> F["Copy it, or send it on to<br/>Optimizer / Score / Shorten"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: each target AI has its own guidance: Claude gets XML-tagged sections, ChatGPT gets Markdown with numbered steps, coding editors get scope and acceptance criteria. Use cases (coding, writing, marketing, business, research) change which sections are included.
The pain: A blank page is slow, and a template full of blanks is easy to leave half-filled.
What you get: Pick a ready-made prompt, fill in the highlighted blanks, add your own points, and copy a finished prompt in seconds. Try it live ↗
flowchart LR
A["Pick a ready-made<br/>prompt from the book"]:::in --> B["Blanks are found<br/>and highlighted"]:::ai
B --> C["You fill them in<br/>and choose options<br/>like tone and length"]:::in
C --> D["You add your own<br/>extra points"]:::in
D --> E["Finished prompt<br/>assembled instantly"]:::out
E --> F["Copy"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: no AI call is involved: placeholders written as [WORDS IN CAPITALS] are detected by rules, and your choices are appended as a short requirements block. It is instant, free and works offline.
The pain: You love how a website looks but cannot describe its design well enough for an AI to recreate it.
What you get: A design prompt that captures the real colours, fonts, spacing and layout, ready for tools like v0, Bolt, Claude or Midjourney. Try it live ↗
flowchart LR
A["Open any website<br/>and click the Cuelara<br/>extension"]:::in --> B["The extension measures the<br/>real page: colours, fonts,<br/>sizes, spacing, layout"]:::in
B --> C["Sent to Cuelara"]:::in
C --> D["Colours ranked by how much<br/>they are really used<br/>brand colours picked out"]:::ai
C --> E["Layout summarised in<br/>plain language, section<br/>by section"]:::ai
D --> F["AI writes the<br/>design prompt"]:::ai
E --> F
F --> G["Paste into your AI<br/>design or coding tool"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: measuring happens in your own browser, so it sees the page as you see it, including pages behind a login. Colour and layout facts are computed by rules first, which keeps the AI step short, cheap and consistent.
The pain: Your document is too big to paste into the AI, and pasting all of it is expensive and invites made-up answers.
What you get: Upload a document, ask a question, and get only the passages that matter, ready to paste, with the tokens you saved. This tool is a RAG (retrieval-augmented generation) pipeline: the AI is given only the retrieved passages instead of the whole file. Try it live ↗
flowchart LR
A["Upload a document<br/>PDF, Word, text, Markdown,<br/>CSV or JSON"]:::in --> B["Cuelara reads<br/>the text"]:::ai
B --> C["RAG step 1: split it<br/>into small passages<br/>(chunking)"]:::ai
C --> D["RAG step 2: turn each<br/>passage into a meaning<br/>fingerprint (embedding)"]:::ai
E["You ask a question"]:::in --> F["The question gets<br/>a fingerprint too"]:::ai
D --> G["RAG step 3: retrieve the<br/>passages closest in meaning"]:::ai
F --> G
G --> H["Only the relevant parts<br/>go to the AI as its context"]:::out
H --> I["Grounded answer material,<br/>ready to paste, with the<br/>tokens saved shown"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: this is RAG: documents are chunked and embedded, the question is embedded the same way, and the closest chunks are retrieved by vector similarity. It is retrieval by meaning, not keyword search, so a question can find a passage that uses different words. Giving the AI only the relevant passages also cuts made-up answers, because it works from your document and not from guesswork. Uploaded documents expire automatically and are cleaned up on later uploads.
The pain: Your prompt is vague or messy, so the AI answers generically or off-target.
What you get: A rewritten prompt with a clear role, steps, constraints and an output format, streamed to you as it is written. Try it live ↗
flowchart LR
A["Paste the prompt<br/>that is not working"]:::in --> B["Choose a mode<br/>General, Coding, Writing,<br/>Business, Research"]:::in
B --> C["Choose the detail<br/>Concise to Comprehensive"]:::in
C --> D["AI rewrites it using a<br/>proven prompt structure"]:::ai
D --> E["Result appears live,<br/>word by word"]:::out
E --> F["Copy it, score it,<br/>or shorten it"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: each mode carries a hand-written example of a strong prompt in that field. They set the quality bar, but the AI writes a fresh prompt for your input instead of filling in a form.
The pain: The AI ignores part of your instructions, contradicts itself or behaves differently each time, and you cannot see why.
What you get: A report of what is wrong, how serious it is and exactly how to fix it, plus the checks your prompt already passes. Try it live ↗
flowchart LR
A["Paste the prompt"]:::in --> B["Choose how strict<br/>Standard, High, Paranoid"]:::in
B --> C["Choose a focus<br/>everything, contradictions,<br/>edge cases, bias and tone"]:::in
C --> D["AI audits the prompt"]:::ai
D --> E{"Clean report<br/>received?"}:::warn
E -->|"no"| D
E -->|"yes"| F["Issues marked critical<br/>or warning, each with<br/>an explanation and a fix"]:::out
F --> G["Optional: rewrite the prompt<br/>with every fix applied"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: the audit must come back as a structured report; if it does not, it is asked again with a sharper reminder. The same engine also powers the public API.
The pain: Your prompt is one long wall of text that is hard to read, hard to edit and easy for the AI to misread.
What you get: The same prompt, organised into clear labelled sections in the format your AI prefers. Try it live ↗
flowchart LR
A["Paste the<br/>wall of text"]:::in --> B["Choose a format<br/>Markdown, XML or JSON"]:::in
B --> C["Choose indentation"]:::in
C --> D["AI sorts it into sections<br/>role, task, constraints,<br/>output format"]:::ai
D --> E["Clean, structured prompt"]:::out
E --> F["Copy"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: XML suits Claude, Markdown suits most chat models, and JSON suits API use. Each format has its own strict output rules, so you do not get a mix of styles.
The pain: You cannot tell if your prompt is any good until you have already sent it and been disappointed.
What you get: A 0 to 100 score for how clear, precise and efficient your prompt is, with a prioritised list of what to improve. Try it live ↗
flowchart LR
A["Paste the prompt"]:::in --> B["Choose how to judge it<br/>Standard, Strict (production)<br/>or Creative"]:::in
B --> C["Choose the target AI"]:::in
C --> D["AI judges three things<br/>clarity, precision, density"]:::ai
D --> E["Overall score 0 to 100<br/>and a tier"]:::out
D --> F["Recommendations ranked<br/>high, medium, low"]:::out
F --> G["Fix them with the<br/>Optimizer"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: the same prompt can score differently under different criteria on purpose: a production pipeline needs strict output rules, while a creative brief should not be penalised for lacking them.
The pain: Long prompts cost money on every call and can hit the AI's length limit.
What you get: A shorter prompt that keeps every instruction, with the real before-and-after token counts. Try it live ↗
flowchart LR
A["Paste a long prompt"]:::in --> B["Choose how hard to squeeze<br/>Low, Medium or Aggressive"]:::in
B --> C["Choose whether to<br/>keep formatting"]:::in
C --> D["AI compresses it"]:::ai
D --> E{"Did it actually<br/>get shorter?"}:::warn
E -->|"barely"| D
E -->|"yes"| F["Real token count<br/>before and after"]:::out
F --> G["Shorter prompt<br/>and the saving"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: levels aim for roughly 15 to 25 percent (Low), 35 to 45 percent (Medium) and 50 percent or more (Aggressive). Savings are measured with real token counting, not estimated, and one automatic retry happens if the first pass barely shrinks the prompt. The same engine is used by the MCP server.
The pain: You rewrote a prompt but cannot see exactly what changed, or whether it really got cheaper.
What you get: A side-by-side comparison of two versions with the token difference and what each costs on popular AI models. Try it live ↗
flowchart LR
A["Original prompt"]:::in --> C["Side-by-side<br/>visual diff"]:::ai
B["New version"]:::in --> C
C --> D["Token count<br/>for each version"]:::ai
D --> E["Cost on popular AI models<br/>using published prices"]:::ai
E --> F["What changed, how many tokens<br/>and how much money it saves"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: prices come from each provider's published rates, kept in one table with the date they were last checked, so estimates stay honest and easy to update.
The pain: people want a starting point, not a lecture on prompt writing.
A library of ready-made prompts for everyday jobs, each with a worked example. Visitors browse by category or search, open a prompt, press Edit this prompt, fill in the blanks and copy a finished version.
flowchart LR
A["Browse by category,<br/>search, or arrive from<br/>the guided start"]:::in --> B["Open a prompt<br/>with a worked example"]:::in
B --> C["Edit this prompt:<br/>fill in the blanks"]:::in
C --> D["Finished prompt"]:::out
D --> E["Copy it, or open it in<br/>the Template Generator"]:::out
F["Admin adds or edits prompts"]:::warn --> G["Meaning fingerprint<br/>refreshed automatically"]:::ai
G --> A
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: the library has its own keyword search, and each published prompt also carries a meaning fingerprint so the guided start can recommend it.
The pain: switching tabs to improve a prompt breaks your flow.
A small button appears in the chat box on ChatGPT, Claude, Gemini and other AI sites. Pick a tool and the prompt is improved in place. The same extension powers Site to Prompt. Nothing is sent until the user chooses a tool, it works without an account, and it can be turned off for any site.
flowchart LR
A["You type a prompt<br/>in ChatGPT, Claude or Gemini"]:::in --> B["Click the Cuelara button<br/>in the chat box"]:::in
B --> C["Pick a tool<br/>optimize, build, shorten,<br/>format, debug"]:::in
C --> D["Cuelara improves it"]:::ai
D --> E["Your prompt is replaced<br/>in the chat box"]:::out
F["Account connected?"]:::warn -->|"yes"| G["Higher plan limits"]:::out
F -->|"no"| H["Works anyway<br/>with free limits"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
The pain: developers want these tools inside the AI apps and code they already use.
The same engines behind the web tools are available to Claude, Cursor and other MCP clients, and as a REST API for building, optimizing, debugging, formatting and compressing prompts.
flowchart LR
A["Claude, Cursor<br/>or another MCP client"]:::in --> C["Personal access token"]:::warn
B["Your own app<br/>calling the API"]:::in --> C
C --> D["Same engines as the<br/>website tools"]:::ai
D --> E["Result returned<br/>to your app or editor"]:::out
C --> F["Plan limits<br/>and usage tracking"]:::warn
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
The pain: good prompts get lost in old chats, and teams keep rewriting the same ones.
flowchart LR
A["Visit without an account"]:::in --> B["Free daily limits<br/>per tool"]:::warn
C["Create an account"]:::in --> D["History of past runs<br/>and saved prompts"]:::out
D --> E["Free or paid plan<br/>higher limits, more history"]:::out
E --> F["Team workspace<br/>shared prompt library,<br/>activity and analytics"]:::out
E --> G["Eligible plans can<br/>bring their own AI keys"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
What visitors see is kept fresh from a simple admin area, without waiting for a new release.
flowchart LR
A["Admin signs in"]:::warn --> B["Tools<br/>switch on or off, reorder,<br/>reword, no deploy"]:::warn
A --> C["Content<br/>prompt book and blog"]:::warn
A --> D["People and plans<br/>users, roles, subscriptions"]:::warn
A --> E["Health<br/>errors, emails, messages,<br/>usage analytics"]:::warn
B --> F["Menus, footer, homepage, sitemap<br/>and tool matching update everywhere"]:::out
classDef in fill:#eef2ff,stroke:#6366f1,color:#1e1b4b
classDef ai fill:#f5f3ff,stroke:#8b5cf6,color:#2e1065
classDef out fill:#ecfdf5,stroke:#10b981,color:#064e3b
classDef warn fill:#fffbeb,stroke:#f59e0b,color:#78350f
Under the hood: what a tool is (its page and behaviour) lives in code; what an admin may change (on or off, wording, order) lives in the database. If the database is unreachable the site falls back to safe defaults instead of an error page.
- Product thinking: a journey that starts from the user's problem instead of a list of features.
- Applied AI: a RAG pipeline (chunking, embeddings, vector retrieval), meaning-based matching of problems to tools and prompts, prompt design, real token accounting and cost-aware model use.
- Full-stack delivery: a public site, accounts and billing, an admin back office, a browser extension and an API, built and shipped by one person.
- Data and operations: careful, additive database changes on a live product, caching, and graceful failure.
Aliyan Faisal
© Aliyan Faisal. All rights reserved. This repository is an overview for viewing only. The Cuelara name, design and source code may not be copied, modified, redistributed or used without written permission.