Ilham

• 

  Generated Board

Inspiration

I draw and use mood boards, and I wanted a simple way to organize the images I dump into them before I manually rearrange them. Ilham is the Arabic word for inspiration, which felt right for a tool made to collect and explore visual ideas.

What it does

Ilham is an infinite mood board for collecting images. You can drop or paste images, move them around, resize them, rotate them, add labels, extract color palettes, and export the result.

It saves the board locally in the browser, so images and their positions remain after a refresh. With an optional Gemini API key, it can describe images, search for images using text, and group similar references into a better starting layout.

How we built it

We built Ilham with React, TypeScript, Vite, Tailwind CSS, shadcn/Base UI, and React Konva for the canvas.

Images, board data, and transforms are stored in IndexedDB. Gemini creates captions and embeddings when a user adds their own API key. We use cosine similarity for search and grouping. The organize calculation runs in a Web Worker so the canvas stays responsive.

Challenges we ran into

The hardest part was making organization useful without making every image line up or overlap. We had to combine semantic similarity with layout rules that pull related images together and push overlapping images apart.

Keeping the app local-first was also challenging. The board needs to update immediately while images and changes save in the background. We added a small queue so repeated movement does not write every tiny change to storage.

Accomplishments that we're proud of

• Built a working, local-first mood board instead of a static demo.
• Added image drop, paste, selection, resize, rotation, color palettes, labels, export, undo, and redo.
• Made AI optional, so the main board works without an API key.
• Added semantic search and automatic organization while keeping manual control with the user.
• Saved images and board positions locally so the work survives a refresh.

What we learned

We learned that AI works best here as a starting point, not as the final designer. Grouping similar images helps, but people still need to arrange references based on taste and context.

We also learned how many small systems a local-first app needs: browser storage, background processing, undo history, and a responsive canvas. Keeping those parts separate made the project easier to build and test.

What's next for Ilham

• Add a preview before applying auto-organize.
• Improve similarity search with a vector database for larger boards.
• Support more AI providers and local models.
• Add chat and safe board tool calls.
• Add image generation for new references.
• Exploring more ways to embed and grouping based on that

Built With

• gemini
• javascript
• react
• tailwindcss
• typescript
• vite
• vitest
• zod
• zustand