File size: 7,108 Bytes
6166c49
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TrackMeNot - Mobile Tracker Free</title>
    <link rel="stylesheet" href="style.css">
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
    <script src="https://unpkg.com/feather-icons"></script>
    <script src="components/navbar.js"></script>
    <script src="components/footer.js"></script>
</head>
<body class="bg-gray-50">
    <custom-navbar></custom-navbar>

    <main class="container mx-auto px-4 py-12">
        <!-- Hero Section -->
        <section class="text-center py-20">
            <h1 class="text-5xl font-bold text-gray-800 mb-6">Take Back Your Privacy</h1>
            <p class="text-xl text-gray-600 max-w-2xl mx-auto mb-10">
                TrackMeNot helps you detect and block mobile tracking attempts in real-time. 
                Stay anonymous and protect your digital footprint.
            </p>
            <div class="flex justify-center gap-4">
                <a href="#download" class="bg-indigo-600 hover:bg-indigo-700 text-white px-8 py-3 rounded-lg font-medium transition duration-300">
                    Download Now
                </a>
                <a href="#how-it-works" class="border border-indigo-600 text-indigo-600 hover:bg-indigo-50 px-8 py-3 rounded-lg font-medium transition duration-300">
                    How It Works
                </a>
            </div>
        </section>

        <!-- Features Section -->
        <section id="features" class="py-16">
            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Powerful Protection Features</h2>
            <div class="grid md:grid-cols-3 gap-8">
                <!-- Feature 1 -->
                <div class="bg-white p-8 rounded-xl shadow-md hover:shadow-lg transition duration-300">
                    <div class="w-14 h-14 bg-indigo-100 rounded-full flex items-center justify-center mb-4">
                        <i data-feather="shield" class="text-indigo-600"></i>
                    </div>
                    <h3 class="text-xl font-semibold mb-3">Real-time Tracking Detection</h3>
                    <p class="text-gray-600">Identifies and blocks tracking attempts as they happen, keeping your data private.</p>
                </div>
                
                <!-- Feature 2 -->
                <div class="bg-white p-8 rounded-xl shadow-md hover:shadow-lg transition duration-300">
                    <div class="w-14 h-14 bg-indigo-100 rounded-full flex items-center justify-center mb-4">
                        <i data-feather="eye-off" class="text-indigo-600"></i>
                    </div>
                    <h3 class="text-xl font-semibold mb-3">Anonymous Browsing</h3>
                    <p class="text-gray-600">Prevents websites and apps from collecting your personal information.</p>
                </div>
                
                <!-- Feature 3 -->
                <div class="bg-white p-8 rounded-xl shadow-md hover:shadow-lg transition duration-300">
                    <div class="w-14 h-14 bg-indigo-100 rounded-full flex items-center justify-center mb-4">
                        <i data-feather="battery" class="text-indigo-600"></i>
                    </div>
                    <h3 class="text-xl font-semibold mb-3">Battery Efficient</h3>
                    <p class="text-gray-600">Runs in the background without draining your battery or slowing your device.</p>
                </div>
            </div>
        </section>

        <!-- How It Works Section -->
        <section id="how-it-works" class="py-16 bg-gray-100 rounded-xl px-8">
            <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">How TrackMeNot Works</h2>
            <div class="max-w-4xl mx-auto">
                <div class="flex flex-col md:flex-row gap-8 items-center mb-12">
                    <div class="md:w-1/2">
                        <h3 class="text-2xl font-semibold mb-4">1. Download & Install</h3>
                        <p class="text-gray-600">Get our lightweight app from the App Store or Google Play. Installation takes less than a minute.</p>
                    </div>
                    <div class="md:w-1/2">
                        <img src="http://static.photos/technology/640x360/1" alt="Download app" class="rounded-lg shadow-md">
                    </div>
                </div>
                
                <div class="flex flex-col md:flex-row-reverse gap-8 items-center mb-12">
                    <div class="md:w-1/2">
                        <h3 class="text-2xl font-semibold mb-4">2. Automatic Protection</h3>
                        <p class="text-gray-600">TrackMeNot runs silently in the background, analyzing all network traffic for tracking attempts.</p>
                    </div>
                    <div class="md:w-1/2">
                        <img src="http://static.photos/technology/640x360/2" alt="App interface" class="rounded-lg shadow-md">
                    </div>
                </div>
                
                <div class="flex flex-col md:flex-row gap-8 items-center">
                    <div class="md:w-1/2">
                        <h3 class="text-2xl font-semibold mb-4">3. Detailed Reports</h3>
                        <p class="text-gray-600">View comprehensive reports showing which trackers were blocked and what data they tried to collect.</p>
                    </div>
                    <div class="md:w-1/2">
                        <img src="http://static.photos/technology/640x360/3" alt="Reports" class="rounded-lg shadow-md">
                    </div>
                </div>
            </div>
        </section>

        <!-- Download Section -->
        <section id="download" class="py-20 text-center">
            <div class="bg-indigo-600 rounded-2xl p-12 text-white">
                <h2 class="text-3xl font-bold mb-6">Ready to Take Control?</h2>
                <p class="text-xl mb-8 max-w-2xl mx-auto">Download TrackMeNot today and start browsing with confidence.</p>
                <div class="flex flex-col sm:flex-row justify-center gap-4">
                    <a href="#" class="bg-white text-indigo-600 hover:bg-gray-100 px-8 py-4 rounded-lg font-bold flex items-center justify-center gap-2">
                        <i data-feather="download"></i>
                        App Store
                    </a>
                    <a href="#" class="bg-white text-indigo-600 hover:bg-gray-100 px-8 py-4 rounded-lg font-bold flex items-center justify-center gap-2">
                        <i data-feather="download"></i>
                        Google Play
                    </a>
                </div>
            </div>
        </section>
    </main>

    <custom-footer></custom-footer>

    <script>
        feather.replace();
    </script>
    <script src="script.js"></script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html>