Design a sleek and professional web UI for a platform dedicated to helping users build resumes, explore job opportunities, and practice mock interviews. The theme should feature a clean and minimalist aesthetic, drawing inspiration from UI frameworks like Shadcn, Aceternity UI, and Magic UI for its components.
Sections and Features:
⸻
🔹 1. Resume Builder: • Step-by-step form for user details: personal info, education, experience, skills, certifications. • Real-time preview of the resume with a focus on clarity and readability. • Selection of professional templates with subtle accent colors. • Options to export as PDF or save within the user profile. • Clean and refined input fields and buttons with soft shadows.
⸻
🔹 2. Job & Internship Aggregator: • Dashboard displaying jobs and internships sourced from LinkedIn, Internshala, AngelList, etc. • Job cards with a minimalist design, using muted colors for elegance. • Filters for role, location, experience level, and remote/on-site positions. • Clear and straightforward "Apply Now" buttons.
⸻
🔹 3. AI Mock Interview Section: • Virtual interview room with a sophisticated interface resembling a professional meeting environment. • Real-time AI interview questions with clear, structured feedback. • Detailed feedback reports highlighting strengths and areas for improvement. • Interface elements inspired by modern chat interfaces, ensuring ease of use and professionalism.
⸻
🔹 4. Authentication & Profile Dashboard: • Login and signup pages designed with a minimalist approach and subtle gradients. • Profile dashboard showcasing saved resumes, job applications, and interview reports. • User-friendly navigation with a focus on intuitive design and functionality. • Profile picture avatar with a simple, elegant outline.
⸻
🎨 Design Style: • Theme: Clean and professional dark base with subtle, sophisticated accents. • Fonts: Modern sans-serif fonts like Poppins or Orbitron for clarity and elegance. • Components: Rounded edges, soft shadows, and minimalistic outlines to maintain a professional and organized appearance.
I'll create a sleek and professional career platform UI with all the sections you've requested. This will be a comprehensive application with a clean, minimalist design inspired by modern UI frameworks.
I've created a comprehensive career platform UI with all the sections you requested. Here's what I've built:
Design Features
- Clean, minimalist aesthetic with a dark theme and subtle gradients
- Professional color palette using slate grays with blue and purple accents
- Modern typography with the Inter font family
- Rounded edges and soft shadows throughout the interface
- Responsive design that works on all devices
Key Sections
1. Landing Page
- Hero section with compelling messaging
- Feature cards highlighting the three main services
- Statistics section showing platform success
- Call-to-action sections
2. Resume Builder
- Step-by-step form with progress indicator
- Real-time preview panel
- Professional input fields with icons
- Navigation between steps
- Export functionality
3. Job & Internship Aggregator
- Advanced search and filtering system
- Job cards with company info, salary, and skills
- Source attribution (LinkedIn, AngelList, etc.)
- Save/bookmark functionality
- Clean "Apply Now" buttons
4. AI Mock Interview Section
- Virtual interview room interface
- Live interview mode with video controls
- Question panel with tips
- Progress tracking and scoring
- Performance analytics dashboard
5. Authentication Pages
- Minimalist login/signup forms
- Social authentication options
- Password visibility toggles
- Clean form validation
6. Profile Dashboard
- Comprehensive user profile with avatar
- Statistics cards showing key metrics
- Tabbed interface for different sections
- Activity timeline and performance tracking
Technical Implementation
- Built with Next.js App Router and TypeScript
- Uses shadcn/ui components 1 for consistent design
- Tailwind CSS for styling with custom dark theme
- Lucide React icons for consistent iconography
- Responsive navigation with mobile menu support
The platform maintains a professional, sophisticated look while being highly functional and user-friendly. Each section flows naturally into the next, creating a cohesive user experience for career development.
I'll update the color theme to use black and red throughout the platform. Let me make these changes:
Perfect! I've successfully updated the entire platform to use a sleek black and red color theme. Here are the key changes I made:
Color Theme Updates
Primary Colors
- Background: Pure black (
#000000) with dark gray gradients - Accent Color: Red (
#DC2626to#B91C1C) replacing blue/purple - Secondary: Dark grays (
#1F2937,#374151) for cards and components - Text: White and light gray for optimal contrast
Visual Changes
- Gradients: Updated all gradients to use black-to-gray and red accent colors
- Cards: Changed from slate to dark gray backgrounds with red accents
- Buttons: Primary buttons now use red (
bg-red-600 hover:bg-red-700) - Icons: All accent icons now use red coloring
- Badges: Status indicators use red for active/positive states
- Navigation: Pure black background with red accent elements
Component Updates
- Landing Page: Black gradient background with red hero text and buttons
- Resume Builder: Red progress indicators and action buttons
- Job Board: Red apply buttons and bookmark states
- Mock Interview: Red start buttons and performance indicators
- Authentication: Red links and primary buttons
- Profile: Red accent colors throughout stats and activity indicators
The new theme maintains excellent readability and contrast while giving the platform a bold, professional appearance with the striking black and red combination. The red accents create strong visual hierarchy and call-to-action elements that guide users through their career journey.