Feedle

• 

  dark mode of the main page

• 

  light mode of the main page

• 

  dark mode of the generated feed

• 

  light mode of the generated feed

• 

  example of caption being generated

🖼️ Feedle

💡 Inspiration

We wanted to solve a creative problem: keeping a social feed consistent in aesthetic, not just color. Creators often struggle to plan the order of posts and maintain a cohesive flow when curating their content. Feedle turns that challenge into a visual tool that helps users curate, plan, and preview their feed by aesthetic, automating the process.

🎨 What it does

Feedle analyzes the aesthetic of a reference photo and filters a folder of images to match its style. It then previews the results in an Instagram-style grid, where users can rearrange the layout and generate captions for selected photos, creating a feed that feels cohesive and expressive.

🧠 How we built it

We built Feedle with HTML, CSS, and JavaScript, using the ColorThief library to extract and compare color palettes. The webpage runs fully client-side, processing images locally for privacy and speed.

⚙️ Challenges

Handling folder uploads across systems was tricky, since 'webkitdirectory' behaves inconsistently on Windows. We also had to balance color similarity with creative flexibility, since being too strict or too loose both affected the aesthetic match.

🏆 Accomplishments and Learnings

We are proud of building a seamless, visual tool that works without a backend. We learned about browser file APIs, image processing, and the subtleties of design-driven development.

🚀 What’s next

We plan to integrate AI-based aesthetic modeling, smarter caption generation, and direct export to content planning tools, evolving Feedle into a creative companion for visual storytelling.reference “vibes” others can match to.

Built With

• css
• html
• javascript