Dashboard Color Descriptions

🎯 KPI Cards (Top Section)

There are 4 KPI (Key Performance Indicator) cards, each with a colored accent line at the top. These colors help visually separate and highlight the different metrics.

  1. Total Door Scans

    • Color: Cyan (#22d3ee)

    • Icon: QR code

    • Metric: Shows the total number of door scans completed this week.

    • Change indicator: Green up arrow (+3.1%) meaning scans increased in the past hour.

  2. Compliance Rate

    • Color: Green (#22c55e)

    • Icon: Shield (security)

    • Metric: Percentage of doors meeting safety standards (92%).

    • Change indicator: Red down arrow (–1.2%) meaning compliance has dropped below tolerance.

  3. Past Due Scans

    • Color: Violet (#8b5cf6)

    • Icon: Clock (time overdue)

    • Metric: Number of doors that are overdue for scanning (47).

    • Change indicator: Green down arrow (–0.8) meaning overdue counts are falling (good).

  4. Open Maintenance Tickets

    • Color: Amber (#f59e0b)

    • Icon: Wrench (repairs)

    • Metric: Number of open repair/maintenance issues related to doors (15).

    • Change indicator: Green up arrow (+2 tickets) showing a rise, but green suggests still within tolerance.

đź“Š Bar Charts

  1. Scans by Day (This Week)

    • Horizontal blue bars (#3b82f6) showing how many door scans were logged each day (Mon–Fri).

    • Values range from 250 (Mon) to 320 (Thu).

  2. Scans by Building

    • Horizontal cyan bars (#22d3ee) showing scan totals across different buildings (A–D).

    • Building D has the highest scans (220), Building A the lowest (150).

🥧 Pie Charts

  1. Scan Status Breakdown

    • Uses three slices:

      • Green (#22c55e) → Completed scans (80%)

      • Red (#ef4444) → Past due scans (15%)

      • Amber (#f59e0b) → Failed scans (5%)

    This chart gives an instant view of how many scans are successful vs. problematic.

  2. Building Compliance Status

    • Uses two slices:

      • Green (#22c55e) → Compliant buildings (92%)

      • Red (#ef4444) → Non-compliant buildings (8%)

    This shows overall compliance health across all buildings.

🚨 Critical Issues Section

Three cards highlight urgent door security problems. Each card has its own color-coded number:

  1. Propped Open Doors

    • Value shown in Red (#ef4444)

    • Metric: 8 doors currently detected as propped open.

  2. Unlocked Doors

    • Value shown in Amber (#f59e0b)

    • Metric: 5 doors left unlocked during inspections.

  3. Bad NFC Tags

    • Value shown in Violet (#8b5cf6)

    • Metric: 12 tags that are defective or failing scans.

Each card includes a “View Details” button for drill-down.

đź“Ś Call-to-Action (CTA)

At the bottom:

  • Green CTA button (#22c55e): “Start Your Trial” → Encourages trying the full version for 30 days.

  • Outlined Green CTA: “Request Quote” → Targets schools/districts needing cost proposals.

âś… Summary of Color Significance

  • Cyan / Blue → Volume/activity metrics (scans, daily activity).

  • Green → Positive outcomes or compliance (good scans, safe status).

  • Red → Alerts, overdue or unsafe conditions (non-compliance, past due scans).

  • Amber → Warnings or pending actions (tickets, failures, unlocked doors).

  • Violet → Secondary alerts (past due scans, bad NFC tags).

Scroll to Top