Back to ComponentsComponent Library

TwoTab Components Demo

Three two-column section components with different content types

TwoTabImageText - Image Left

Two-column layout with image and text content

AI Detection
Our Technology

Advanced AI Detection

Our state-of-the-art AI cameras detect threats in real-time, providing instant alerts and actionable intelligence. With machine learning capabilities that improve over time, your security system gets smarter every day.

TwoTabImageText - Image Right

Same component with reversed layout

24/7 Monitoring
24/7 Monitoring

Always-On Protection

Never miss a moment with our continuous monitoring system. Cloud-based storage ensures your footage is safe and accessible from anywhere, anytime. Get peace of mind knowing your property is protected around the clock.

TwoTabImageLink

Two-column layout with icon items list. Links to related pages.

Case Studies
Case Studies

See How We Help Businesses

Discover how organizations across industries are using SCT+ cameras to prevent crime, reduce costs, and improve safety.

Construction Sites

Prevent theft and vandalism at remote job sites with 24/7 solar-powered surveillance.

Parking Facilities

Monitor vehicles and prevent incidents across large parking structures.

Residential Communities

Protect residents and property with intelligent perimeter monitoring.

TwoTabStats - Image Left

Two-column layout with stat cards (value, label, description)

Performance Stats
Proven Results

Industry-Leading Performance

Our AI-powered cameras deliver measurable results that transform security operations.

94%
Threat Detection Accuracy

AI-powered precision

78%
Reduction in False Alarms

Smarter filtering

3x
Faster Response Times

Real-time alerts

89%
Customer Satisfaction

Net promoter score

TwoTabStats - Image Right

Same component with reversed layout

ROI Stats
ROI Impact

Security That Pays for Itself

See the financial benefits of SCT+ intelligent surveillance systems.

85%
Cost Savings

vs. traditional security

92%
Incidents Prevented

Proactive deterrence

71%
Insurance Reduction

Lower premiums

4.8/5
Would Recommend

Customer rating

Component Usage

TwoTabImageText

General two-column layout for features, benefits, or any content with image + text.

<TwoTabImageText
  eyebrow="Feature"
  heading="Your Heading"
  description="Your description text..."
  image={{ src: '/path.jpg', alt: 'Alt text' }}
  primaryCTA={{ text: 'Primary', href: '/link' }}
  secondaryCTA={{ text: 'Secondary', href: '/link' }}
  imagePosition="left" // or "right"
/>

TwoTabImageLink

Two-column layout with image + list of icon items. Ideal for feature breakdowns and case study links.

<TwoTabImageLink
  eyebrow="Resources"
  heading="Your Heading"
  description="Description text..."
  image={{ src: '/path.jpg', alt: 'Alt text' }}
  items={[
    { icon: <SvgIcon />, title: 'Item Title', description: 'Item description' },
    // ... more items
  ]}
  primaryCTA={{ text: 'Primary', href: '/link' }}
  secondaryCTA={{ text: 'Secondary', href: '/link' }}
  imagePosition="left" // or "right"
/>

TwoTabStats

Two-column layout with stat cards (2x2 grid). Displays value, label, and optional description. Values are strings for flexibility (e.g. "94%", "3x", "4.8/5").

<TwoTabStats
  eyebrow="Results"
  heading="Your Heading"
  description="Your description text..."
  image={{ src: '/path.jpg', alt: 'Alt text' }}
  stats={[
    { value: '94%', label: 'Stat 1', description: 'Optional detail' },
    { value: '3x', label: 'Stat 2' },
    { value: '62%', label: 'Stat 3' },
    { value: '4.8/5', label: 'Stat 4' },
  ]}
  primaryCTA={{ text: 'Primary', href: '/link' }}
  imagePosition="left" // or "right"
/>