Files
homaroma/homaroma_lucide_icons.md
2026-10-01 05:49:58 +07:00

7.2 KiB

HomAroma Reference Tenant: Curated Lucide Icon Registry

Tenant asset: This registry includes fragrance/wellness icon choices for HomAroma. DBK Platform tenants should maintain their own vertical-appropriate registries or use only the shared general icons.

This document contains a curated list of 80 lucide-react icons tailored specifically for the HomAroma project. It is divided into 30 business-specific icons (Home Fragrance & Wellness) and 50 general E-commerce icons.

You can use this list directly in your iconRegistry.ts file to populate the Admin Dropdown and Frontend components.

🌿 30 Business-Specific Icons (HomAroma / Fragrance / Wellness)

These icons are selected to represent product categories, scent notes, moods, and the core identity of a home fragrance and wellness brand.

Icon Name Suggested Usage / Meaning
Sparkles Signature products, Best sellers, Magic / Premium
Leaf Organic, Natural ingredients, Green notes
Wind Aroma, Diffusers, Air circulation, Scent throw
Droplets Essential oils, Serums, Liquid extracts
Flower2 Floral scent notes (Rose, Jasmine, etc.)
Flame Candles, Warmth, Fireplace
Sofa Home decor, Living room ambiance
BedDouble Bedroom, Sleep wellness, Pillow mists
Bath Bath & Body products, Spa, Relaxation
Sun Morning routines, Bright / Uplifting scents
Moon Night routines, Calming / Sleep scents
TreePine Woody scent notes (Cedar, Sandalwood, Pine)
Sprout Plant-based, Vegan, Clean beauty
Coffee Gourmand notes (Coffee, Vanilla, Warmth)
Waves Ocean breeze, Aquatic scent notes
Cherry Fruity / Berry scent notes
Citrus Citrus notes (Orange, Lemon, Bergamot)
Snowflake Cooling, Mint, Crisp winter notes
Palmtree Tropical / Summer collections
Crown Luxury / Exclusive collections
Gem Rare / Premium ingredients
Feather Light, Gentle, Sensitive skin
Smile Mood enhancing, Happiness
Zap Energizing, Invigorating scents
Cloud Airy, Soft, Linen sprays
Beaker Formulation, Lab, Science of scent
SprayCan Room sprays, Body mists
Wine Rich / Boozy notes (Bourbon, Rum)
MountainSnow Earthy, Fresh mountain air
Vegan Cruelty-free, Vegan certification

🛒 50 General E-commerce & UI Icons

These icons are essential for standard E-commerce navigation, user accounts, checkout flows, and UI controls.

Shopping & Cart

Icon Name Suggested Usage / Meaning
ShoppingBag Cart (Bag style)
ShoppingCart Cart (Trolley style)
Package Orders, Physical products
Truck Shipping, Delivery
CreditCard Payment methods
Wallet Store credit, Points
Tag Sale, Price tags
Percent Discounts, Promotions
Gift Gift cards, Wrapping service
Ticket Vouchers, Coupons
Store Physical stores, About the brand

Account & User

Icon Name Suggested Usage / Meaning
User My Account, Profile
Heart Wishlist, Favorites
Clock Order history, Recently viewed
MapPin Shipping address, Store locator
Settings Account settings
LogOut Sign out
LogIn Sign in
Bell Notifications
Bookmark Saved for later

Navigation & Actions

Icon Name Suggested Usage / Meaning
Search Search bar
Menu Mobile hamburger menu
X Close modals / drawers
ArrowRight Next step, Call to action
ArrowLeft Go back
ChevronRight Breadcrumbs, Accordion
ChevronDown Dropdowns
Plus Add to cart / Expand
Minus Decrease quantity / Collapse
Trash2 Remove item
Eye Quick view
Filter Filter products
SlidersHorizontal Sort & Filter options
RefreshCw Returns, Exchanges, Sync
Camera Upload photo (Reviews)
Share2 Share product

Information & Trust

Icon Name Suggested Usage / Meaning
Award Quality guarantee, Awards
ShieldCheck Secure payment, Warranty
Star Reviews, Ratings
ThumbsUp Helpful review
HelpCircle FAQ, Help center
Info Product details, About
Phone Customer service (Phone)
Mail Newsletter, Email support
MessageCircle Live chat
CheckCircle2 Success states, Validation
XCircle Error states
AlertCircle Warnings, Important notices
Calendar Delivery dates, Events
Box Inventory, General item

💻 Example Implementation (TypeScript)

You can copy and paste this into your iconRegistry.ts file:

import {
  // Business
  Sparkles, Leaf, Wind, Droplets, Flower2, Flame, Sofa, BedDouble, Bath,
  Sun, Moon, TreePine, Sprout, Coffee, Waves, Cherry, Citrus, Snowflake,
  Palmtree, Crown, Gem, Feather, Smile, Zap, Cloud, Beaker, SprayCan,
  Wine, MountainSnow, Vegan,
  
  // E-commerce
  ShoppingBag, ShoppingCart, Package, Truck, CreditCard, Wallet, Tag, Percent,
  Gift, Ticket, Store, User, Heart, Clock, MapPin, Settings, LogOut, LogIn,
  Bell, Bookmark, Search, Menu, X, ArrowRight, ArrowLeft, ChevronRight,
  ChevronDown, Plus, Minus, Trash2, Eye, Filter, SlidersHorizontal, RefreshCw,
  Camera, Share2, Award, ShieldCheck, Star, ThumbsUp, HelpCircle, Info,
  Phone, Mail, MessageCircle, CheckCircle2, XCircle, AlertCircle, Calendar, Box
} from 'lucide-react';

export const ICON_REGISTRY = {
  // Business
  'sparkles': Sparkles,
  'leaf': Leaf,
  'wind': Wind,
  'droplets': Droplets,
  'flower': Flower2,
  'flame': Flame,
  'sofa': Sofa,
  'bed': BedDouble,
  'bath': Bath,
  'sun': Sun,
  'moon': Moon,
  'tree-pine': TreePine,
  'sprout': Sprout,
  'coffee': Coffee,
  'waves': Waves,
  'cherry': Cherry,
  'citrus': Citrus,
  'snowflake': Snowflake,
  'palmtree': Palmtree,
  'crown': Crown,
  'gem': Gem,
  'feather': Feather,
  'smile': Smile,
  'zap': Zap,
  'cloud': Cloud,
  'beaker': Beaker,
  'spray-can': SprayCan,
  'wine': Wine,
  'mountain': MountainSnow,
  'vegan': Vegan,

  // E-commerce
  'shopping-bag': ShoppingBag,
  'shopping-cart': ShoppingCart,
  'package': Package,
  'truck': Truck,
  'credit-card': CreditCard,
  'wallet': Wallet,
  'tag': Tag,
  'percent': Percent,
  'gift': Gift,
  'ticket': Ticket,
  'store': Store,
  'user': User,
  'heart': Heart,
  'clock': Clock,
  'map-pin': MapPin,
  'settings': Settings,
  'logout': LogOut,
  'login': LogIn,
  'bell': Bell,
  'bookmark': Bookmark,
  'search': Search,
  'menu': Menu,
  'close': X,
  'arrow-right': ArrowRight,
  'arrow-left': ArrowLeft,
  'chevron-right': ChevronRight,
  'chevron-down': ChevronDown,
  'plus': Plus,
  'minus': Minus,
  'trash': Trash2,
  'eye': Eye,
  'filter': Filter,
  'sliders': SlidersHorizontal,
  'refresh': RefreshCw,
  'camera': Camera,
  'share': Share2,
  'award': Award,
  'shield-check': ShieldCheck,
  'star': Star,
  'thumbs-up': ThumbsUp,
  'help': HelpCircle,
  'info': Info,
  'phone': Phone,
  'mail': Mail,
  'chat': MessageCircle,
  'check-circle': CheckCircle2,
  'x-circle': XCircle,
  'alert': AlertCircle,
  'calendar': Calendar,
  'box': Box,
} as const;

export type AvailableIcons = keyof typeof ICON_REGISTRY;