======================================================================================================

[ CPAP Links Hub Logo/Home ] | [ Search Bar ]

1. GETTING STARTED & SUPPORT

Forums & Patient Communities
Non-Profit Advocacy
New User Guides

2. MACHINES & SUPPLIES

CPAP Retailers (Online Shops)
DME Suppliers (Insurance)
Accessories & Parts

3. CLINICAL & OFFICIAL DATA

Manufacturers’ Official Sites
Medical Guidelines (AASM, etc.)
Device Recalls & Safety (FDA)

4. ALTERNATIVES & COMPARISONS

Oral Appliances (OAT)
Surgical Options
Positional Therapy
Machine Comparison Charts

======================================================================================================

Plaintext

======================================================================================================
[ CPAP Links Hub Logo/Home ]       |       [ Search Bar ]
======================================================================================================

1. GETTING STARTED & SUPPORT
   > Forums & Patient Communities
   > Non-Profit Advocacy
   > New User Guides

2. MACHINES & SUPPLIES
   > CPAP Retailers (Online Shops)
   > DME Suppliers (Insurance)
   > Accessories & Parts

3. CLINICAL & OFFICIAL DATA
   > Manufacturers' Official Sites
   > Medical Guidelines (AASM, etc.)
   > Device Recalls & Safety (FDA)

4. ALTERNATIVES & COMPARISONS
   > Oral Appliances (OAT)
   > Surgical Options
   > Positional Therapy
   > Machine Comparison Charts

======================================================================================================

This structure ensures that the user can immediately find the core area they need (e.g., “I need to buy something” → Machines & Supplies) and then refine their search with the specific sub-category (e.g., “I need a replacement tube” → Accessories & Parts).

CPAP Links Hub: Website Visuals and Branding Guide

The visual strategy should balance medical professionalism (trust and authority) with comfort (focus on sleep and relief).

1. Site-Wide Branding and Imagery

Element	Recommendation	Purpose
Color Palette	Soft blues, deep indigos, and calming grays (evoking night/sleep), complemented by a light teal or green for action buttons (trust/health).	Creates a calm, therapeutic, and authoritative atmosphere.
Visual Style	Use modern, professional illustrations or flat-style icons. Avoid cluttered stock photography; if using photos, they should be well-lit and feature diverse users comfortably using equipment.	Maintains a clean, trustworthy, and non-overwhelming appearance.
Homepage Banner	A high-quality, abstract image of a calm, restful sleep environment (e.g., a serene bedroom bathed in moonlight, or a stylized graphic of a lung/airway).	Establishes the theme of rest and health immediately.

2. Quick Access: The Four Pillars

Use distinct, recognizable icons for each of the four main navigation pillars to make them easier to scan and identify.

Pillar Section	Icon Recommendation	Purpose
1. Support & Community	Speech Bubble or Group of Silhouettes/Heads	Represents conversation, collaboration, and peer support.
2. Machines & Supplies	CPAP Machine/Mask Outline or Shopping Cart	Clearly signifies commerce and equipment procurement.
3. Clinical & Official Data	Medical Cross/Caduceus or Official Seal/Gavel	Denotes authority, regulatory information, and professional medicine.
4. Alternatives & Comparisons	Three-Option Fork or Scale/Comparison Chart Icon	Represents choice, decision-making, and exploring multiple pathways.

3. Diagnosis to Treatment Flow

The visual funnel on the home page (Diagnosis to Treatment) should be a simple, three-step illustration to guide the user visually through the process.

Step	Visual Recommendation	Purpose
STEP 1: SUSPICION	Question Mark Icon or Sleeping Face with Zzz’s	Signals the start of the journey and initial awareness.
STEP 2: DIAGNOSIS	Home Sleep Test Device or Stethoscope Icon	Represents the act of testing and professional medical review.
STEP 3: THERAPY	Green Checkmark or User Happily Wearing a Mask	Represents the positive outcome: compliance and successful treatment.

4. Safety & Technical Section

The “Urgent: Device Recalls” section needs a strong visual cue to draw immediate attention.

Section	Visual Recommendation	Purpose
Safety Alert	Red Warning Triangle or Exclamation Point in a Circle	Ensures the user recognizes the immediate importance of the content.
Featured Resource	Digital Waveform/Chart Icon (for OSCAR)	Highlights the technical nature of the data analysis tool.

1. Icon Libraries (For Functional Icons)

For the Four Pillars, the Diagnosis to Treatment Flow, and the Safety Alert, an icon library is the best choice for clarity and consistency.

• Lucide Icons or Phosphor Icons: These are excellent choices for modern, clean, and scalable flat-line icons. They offer the exact types of symbols needed (e.g., speech bubble, shopping cart, medical cross).
  • Recommendation: Use a single, unified weight/style from one library across the entire site for visual harmony.

2. Stock Illustration/Photo Sources (For Branding and Banners)

Since commercial stock image sites may require licensing, I recommend using free, high-quality resources and focusing your searches on illustrations for consistency.

Visual Element	Recommended Search Terms (For Free Stock Sites like Unsplash, Pexels, or Free Pik Illustrations)
Color Palette	“Indigo blue background,” “soft blue gradient,” “calm gray texture”
Homepage Banner	“Serene sleep illustration,” “abstract sleep cycle graphic,” “stylized lung and airway,” “minimalist bedroom night”

Element in Guide	Best Source	Specific Icon/Visual to Look For
1. Support & Community	Icon Library	message-square, users, or group
2. Machines & Supplies	Icon Library	shopping-cart, air-vent, or breathing-mask
3. Clinical & Official Data	Icon Library	crosshair, gavel, or certificate
4. Alternatives & Comparisons	Icon Library	scale, git-branch (for the “fork” option), or bar-chart
Safety Alert	Icon Library	alert-triangle or bell
Digital Waveform (for OSCAR)	Icon Library	line-chart, activity, or pulse

CPAP Links Hub: Recommended Color Palette

This palette is based on themes of calm, night, and clinical trust, using your requested inputs: Indigo Blue (Authority/Night), Soft Blue (Calm/Accent), and Calm Gray (Neutral/Texture).

Color Name	Hex Code	Usage Recommendation	Source Concept
Primary Base (Night Sky)	#1A237E	Site Header, Footer, Hero Backgrounds. Use as the primary dark color for trust and professionalism. Ensure white text is used over this color.	Indigo Blue Background
Accent Primary (Sleep Calm)	#4FC3F7	Card Backgrounds, Primary Buttons (Hover State), Section Dividers. A refreshing, calming blue that pairs well with the deep indigo.	Soft Blue Gradient
Accent Gradient Midpoint	#29B6F6	Used for subtle gradient transitions between the Primary Base and Accent Primary colors.	Soft Blue Gradient
Neutral Base (Calm Texture)	#B0BEC5	Subtle Backgrounds, Borders, Light Text, Disabled States. A cool gray for subtle, non-distracting neutral elements.	Calm Gray Texture
Action & Trust (Health Signal)	#00BCD4	Call-to-Action (CTA) Buttons, Highlighted Links, Icon Colors (e.g., Clinical Data icon). A punchy, accessible color for high-value interactions.	Trust/Health Color
Text & Contrast	#FAFAFA	Primary text color used over the dark Primary Base (#1A237E).	High Contrast
Alert/Warning	#FBC02D	Safety Alert Banners (e.g., FDA Recalls). A standard color for drawing urgent attention.	Functional Color

Implementation Note:

To achieve the “Soft Blue Gradient” effect, you can use a CSS gradient combining the Primary Base (#1A237E) and the Accent Primary (#4FC3F7) with the Accent Gradient Midpoint (#29B6F6) as a transition stop.