Petal Gloss
Beauty App Design Template
Lumé is a glossy beauty shopping app design in a Petal Gloss aesthetic, made for founders and designers building a cosmetics or skincare product.
探索各界面
预览 beauty 移动应用设计，可在 Sleek 中完整编辑。
关于 Beauty App
Lumé is a beauty app design template built around a "Petal Gloss" look: a warm porcelain-cream base, deep rosewood text, blush-petal surfaces, and a single liquid-gold accent reserved for primary actions. Cards lift off the cream ground with soft blush-tinted glows instead of hard borders, a high-contrast fashion serif carries product names, and a tight uppercase grotesque handles labels and prices. The result reads like sunlight on bare skin at a vanity mirror.
The template ships six connected screens that form a complete shopping and routine flow: a Discover home with an editorial hero and trending products, a glossy Product detail with shade swatches and reviews, a Shade Match skin-tone selector, a Ritual Builder timeline, a Beauty Bag cart with subtotal, and a Profile with skin data and ritual consistency. A signature Shade Strip of real makeup swatch dots recurs across the cards, so the catalog feels like browsing actual color.
Use it in Sleek and make it yours: restyle the palette, edit any screen with AI by describing the change, and add the flows your product needs. Then export it to code, copy it into Figma, or hand a prompt to an AI agent to build it for real, far faster than starting from a blank canvas.
包含的界面
Discover
An editorial home with a glass-skin hero feature, category pills for Skincare, Lips, Eyes, and Tools, and a trending grid where each product tile shows a shade strip, star rating, and price. The browse-and-shop entry point.
Product Detail
A large glossy product hero for the Dew Drop Serum with name in fashion serif, a row of tappable shade swatches, a 4.9 star rating, ingredient highlights, and a gold "Add to Bag" button. Where shoppers decide and buy.
Shade Match
A guided skin-tone analysis with a dewy face swatch preview, selectable shade chips (20W, 22N, 24W), and ranked product matches with confidence percentages and add-to-bag actions. Helps shoppers find their exact shade.
Ritual Builder
A morning timeline of routine steps as stacked tonal cards: Cleanse, Treat, Seal, and Protect, each with a product thumbnail, time, and tip, plus a collapsed Evening Reset section. Turns products into a daily glow routine.
Beauty Bag
A cart grouped by Skincare Essentials and Color Collection with thumbnails, shade labels, quantity steppers, a gold total estimate, and a satin "Checkout Now" button. The purchase moment.
Profile
A member profile with avatar, loyalty level, wishlist and points stats, an editable Skin Profile of type, tone, and concerns, and a weekly Ritual Consistency bar chart. Keeps the routine personal and on track.
核心功能
- Petal Gloss aesthetic: porcelain cream, rosewood ink, blush, liquid-gold accent
- Signature Shade Strip of tappable makeup swatch dots across cards
- High-contrast fashion serif paired with uppercase grotesque labels
- Tonal stacked surfaces that lift on soft blush glows, no hard borders
- Floating frosted-glass nav bar with a gold active state
- Editorial dewy-skin photography and crisp product shots
- Shade-match flow with confidence-scored recommendations
- Routine builder timeline with morning and evening rituals
适合谁
你可以做什么
- Launch an MVP for a beauty or skincare shopping app
- Mock up screens for an investor or brand pitch
- Hand a consistent beauty app UI off to developers
- Explore a redesign of an existing cosmetics store
如何使用此模板
- 1
打开模板
浏览各界面并预览完整设计，看看是否契合你的想法。
- 2
使用此模板
一键在 Sleek 中打开你自己的完全可编辑副本。
- 3
用 AI 编辑
只需描述你想要的效果，就能重设配色、改布局、增删界面。
- 4
导出并上线
导出设计或交给开发者，继续推进上线。
有问必答。 开始之前你需要了解的一切。
How do I build a beauty app from this template?
What screens are included in this beauty app design template?
Can I customize the beauty app UI design?
Is this template suitable for a beauty salon app?
Is this beauty app design template free to use?
Can I export the design to code or Figma?
还有其他问题？请发邮件至 support@sleek.design。
开始设计你的 beauty 应用
在 Sleek 中使用并改成你的：重设配色、用 AI 编辑任意界面，再导出为代码或 Figma。