I Built FaceFit: An AI Face Shape Detector with Hairstyle and Glasses Recommendations
As developers, we often build tools that solve technical problems: dashboards, APIs, automation systems, internal tools, and SaaS products. This time, I wanted to build something a little more visual, personal, and prac
As developers, we often build tools that solve technical problems: dashboards, APIs, automation systems, internal tools, and SaaS products.
This time, I wanted to build something a little more visual, personal, and practical.
So I created FaceFit β an AI-powered face shape detector that helps users find their closest face-shape match from a photo and get personalized hairstyle and glasses recommendations.
You can try it here: FaceFit - AI Face Shape Detector
Why I built it
Many people search for questions like:
- What is my face shape?
- Do I have an oval or round face?
- What hairstyles suit my face shape?
- What glasses look good on my face?
The problem is that most advice online is either too generic or requires users to manually compare their face with diagrams.
I wanted to create a tool that makes this process easier.
Instead of asking users to guess their face shape, FaceFit lets them upload a photo, get a closest match, and then explore style recommendations based on that result.
What FaceFit does
FaceFit currently focuses on six common face-shape categories:
- Oval
- Round
- Square
- Heart
- Diamond
- Oblong
After analyzing the uploaded photo, the tool gives users a closest face-shape match and then provides guidance such as:
- hairstyle directions for that face shape
- glasses and frame recommendations
- style tips based on facial proportions
- related face-shape guides and blog content
The goal is not just to output a label like βovalβ or βround.β
The goal is to help users understand what that result means and how they can use it when choosing hairstyles, glasses, or personal style references.
Product idea
A lot of AI tools stop at detection.
But for a consumer-facing product, detection alone is usually not enough.
If a user uploads a photo and only gets a result like:
Your face shape is round.
That is interesting, but not very useful.
So I wanted FaceFit to go one step further:
Your closest match is round, and here are hairstyle and glasses directions that may work better for your facial proportions.
This makes the experience more practical.
The AI result becomes a starting point for decision-making, not just a raw output.
Tech stack
The project is built as a modern web app.
The current stack includes:
- Next.js for routing and frontend structure
- React for UI components
- AI / face analysis logic for estimating face-shape signals
- Responsive design for desktop and mobile users
- SEO-focused content pages for face shape, hairstyle, and glasses guides
I also built supporting pages for different face shapes so users can continue exploring after getting their result.
For example, someone who gets a round face result can continue reading about round face hairstyles or glasses recommendations.
Challenges I faced
One of the biggest challenges was handling real-world user photos.
In a perfect test environment, every image would have:
- front-facing angle
- good lighting
- clear facial outline
- no heavy shadows
- no extreme camera distortion
- no hair covering the face
But real users do not upload perfect test images.
They upload photos with different lighting, angles, expressions, hairstyles, backgrounds, and image quality.
So the product needs to be designed with uncertainty in mind.
Instead of presenting the result as an absolute truth, FaceFit uses the idea of a closest face-shape match.
This feels more honest and more useful.
Face shape is not always a strict category. Many people are between two shapes, such as oval and oblong, or round and heart. The product needs to explain that clearly.
Another challenge: recommendations
Another challenge was mapping face-shape results to meaningful recommendations.
It is not enough to say:
Round face β short hair
Square face β soft hair
Oval face β anything works
That kind of advice is too shallow.
A useful recommendation system needs to consider:
- face length
- visual width
- jawline softness or angularity
- chin shape
- balance between forehead, cheekbones, and jaw
- whether the goal is to soften, balance, lengthen, or highlight features
This is where the product becomes more than a simple detector.
It becomes a style recommendation experience.
SEO and content strategy
Since this is a public-facing product, I also spent time thinking about SEO.
Many users do not search for the product name. They search for problems and questions.
So I created content around topics like:
- What is my face shape?
- How to determine your face shape
- Hairstyles for different face shapes
- Glasses for different face shapes
- Face shape guides for oval, round, square, heart, diamond, and oblong faces
The idea is to make the tool discoverable through useful educational content, not only through the homepage.
One example is this guide:
What I learned
Building FaceFit reminded me that AI products are not only about the model.
The model is only one part of the experience.
A useful AI product also needs:
- clear user flow
- understandable results
- good explanations
- trust and privacy considerations
- useful next steps
- content that helps users take action
For this kind of product, the output should not feel like a black box.
Users should understand why they received a certain result and what they can do with it.
Future improvements
Some improvements I am considering next:
- better result explanations
- stronger face-shape confidence signals
- more hairstyle recommendation pages
- more glasses and frame examples
- better support for different photo conditions
- improved mobile upload experience
- more educational content around facial proportions
- possibly makeup or beard style recommendations in the future
Feedback wanted
I would love feedback from the DEV community.
Especially on:
- the product idea
- the user flow
- the AI result explanation
- the SEO/content structure
- the recommendation experience
You can try the project here:
What would you improve first: the AI analysis, the recommendation system, or the user experience?
Originally published by Dev.to AI. Aggregated on AIWithGhost for educational purposes β full credit and traffic to the original publisher.