https://www.movierecs.ai/

1<!DOCTYPE html>
2<html lang="en">
3<head>

3
4    <script async src="https://www.googletagmanager.com/gtag/js?id=

4G-KSNX21ZR11

4"></script>
5        

5<script>
6        

6window.dataLayer = window.dataLayer || [];
7        function gtag(){dataLayer.push(arguments);}
8        gtag('js', new Date());
9
10        gtag('config', '

10G-KSNX21ZR11

10'); 
11    

11</script>

11
12    <!-- ADSENSE DESACTIVADO TEMPORALMENTE
13    

13<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8335743891643360"
14    crossorigin="anonymous">
15    </script>

15
16    -->
17    

17<script type='text/javascript'>
18        window.smartlook||(function(d) {
19        var o=smartlook=function(){ o.api.push(arguments)},h=d.getElementsByTagName('head')[0];
20        var c=d.createElement('script');o.api=new Array();c.async=true;c.type='text/javascript';
21        c.charset='utf-8';c.src='https://web-sdk.smartlook.com/recorder.js';h.appendChild(c);
22        })(document);
23        smartlook('init', '28df6c730c4c206adab4f86784456a9e2dcaa7a7', { region: 'eu' });
24    </script>

24
25    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
26    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
27    <!-- <style>
28        .search-button { border: none !important; }
29    </style> -->
30    <meta charset="UTF-8">
31    <meta name="viewport" content="width=device-width, initial-scale=1.0">
32    <link rel="icon" type="image/x-icon"  href="./images/m-r-favicon.png">
33    <title>Movierecs.ai — AI Movie Recommendations Engine | Find Films Like Your Favorites</title>
34    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" rel="stylesheet">
35    <link rel="stylesheet" href="styles.css">
36    <meta name="title" content="Movierecs.ai — AI Movie Recommendations Engine | Find Films Like Your Favorites">
37    <meta name="description" content="Find your next favorite movie with the best AI recommendations app. Discover the right films for you from over 40,000 movies and save time.">
38    <link rel="canonical" href="https://www.movierecs.ai/">
39    <meta property="og:type" content="website">
40    <meta property="og:url" content="https://www.movierecs.ai/">
41    <meta property="og:title" content="Movierecs.ai — AI Movie Recommendations Engine">
42    <meta property="og:description" content="Find your next favorite movie with the best AI recommendations app. Discover the right films for you from over 40,000 movies and save time.">
43    <meta name="twitter:card" content="summary_large_image">
44    <meta name="twitter:title" content="Movierecs.ai — AI Movie Recommendations Engine">
45    <meta name="twitter:description" content="Find your next favorite movie with the best AI recommendations app. Discover the right films for you from over 40,000 movies and save time.">
46    <!-- <meta name="google-adsense-account" content="ca-pub-8335743891643360"> -->
47    

47<script type="application/ld+json">
48    {
49      "@context": "https://schema.org",
50      "@type": "WebApplication",
51      "name": "Movierecs.ai",
52      "alternateName": ["Movierecs", "Movie Recs", "Movie Recommendations AI"],
53      "url": "https://www.movierecs.ai/",
54      "description": "AI-powered movie recommendations engine. Find films like your favorites or describe what you're in the mood for and discover the right movies from over 40,000 titles.",
55      "applicationCategory": "EntertainmentApplication",
56      "operatingSystem": "Any",
57      "browserRequirements": "Requires JavaScript. Modern browser.",
58      "offers": {
59        "@type": "Offer",
60        "price": "0",
61        "priceCurrency": "USD"
62      },
63      "publisher": {
64        "@type": "Organization",
65        "name": "Movierecs.ai",
66        "url": "https://www.movierecs.ai/"
67      },
68      "potentialAction": {
69        "@type": "SearchAction",
70        "target": {
71          "@type": "EntryPoint",
72          "urlTemplate": "https://www.movierecs.ai/?q={search_term_string}"
73        },
74        "query-input": "required name=search_term_string"
75      }
76    }
77    </script>

77
78</head>
79<body class="dark-mode">
80    <!-- Session-tracking consent banner (PR #2 spec).
81         Hidden by default; initTracking() un-hides if no decision yet stored. -->
82    <div id="consent-banner" class="consent-banner hidden" role="dialog" aria-label="Session tracking consent">
83        <div class="consent-content">
84            <p>
85                We store an anonymous session ID to learn which movies tend to
86                be discovered together. No personal data, no cookies, gone when
87                you close the tab.
88            </p>
89            <div class="consent-buttons">
90                <button id="consent-accept" class="btn-primary">Got it</button>
91                <button id="consent-decline" class="btn-secondary">I prefer not to</button>
92            </div>
93        </div>
94    </div>
95    <header>
96        <nav>
97            <div class="logo">
98                <a href="https://www.movierecs.ai">
99                    <img src="./images/beta-logo-trans.png" alt="MOVIERECS.AI Logo" class="logo-image">
100                </a>
101            </div>
102            <div class="mode-toggle-container">
103                <div class="mode-toggle">
104                    <span class="mode-toggle-icon">🌙</span>
105                    <label class="mode-toggle-label">
106                        <input type="checkbox" id="modeToggle">
107                        <span class="mode-toggle-slider"></span>
108                    </label>
109                    <span class="mode-toggle-icon">☀️</span>
110                </div>
111            </div>
112            <div class="share-icon-container">
113                <a href="#" class="share-button">
114                    <img src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Share%20button-DOCW44AtTP1NOB4vKYrqVafMSUOcpy.png" alt="Share" class="share-icon">
115                </a>
116            </div>
117        </nav>
118    </header>
119    <main>
120        <h1>AI Movie recommendations</h1>
121        <h2>Spend time watching great movies, not searching for them</h2>
122        <div class="search-container" id="searchContainer">
123            <div class="search-mode-container">
124                <div class="search-mode-toggle" id="searchModeToggle">
125                    <button class="active" data-mode="similar">Similar</button>
126                    <button data-mode="description">Description</button>
127                </div>
128            </div>
129            <div id="selectedMovies" class="selected-movies"></div>
130            <textarea 
131                id="descriptionInput" 
132                class="search-input description-input" 
133                placeholder="Tell us about the movie you want to watch"
134                style="display: none;"></textarea>
135            <div class="search-input-container">
136                <input 
137                    type="text" 
138                    id="searchInput" 
139                    class="search-input" 
140                    placeholder="Type the name of a movie you loved"
141                    autocomplete="off">
142                <button id="addMovieButton" class="add-movie-button">Add</button>
143            </div>
144            <p class="search-hint" id="searchHint">Add up to 3 movies you love. No log in required.</p>
145            <style>
146              .axis-selector{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:6px 0 12px;}
147              .axis-selector .axis-label{font-size:13px;opacity:.65;margin-right:2px;}
148              .axis-pill{background:transparent;border:1px solid currentColor;opacity:.5;border-radius:999px;padding:5px 14px;font-size:13px;cursor:pointer;transition:all .15s;color:inherit;}
149              .axis-pill:hover{opacity:.8;}
150              .axis-pill.active{opacity:1;background:#e0322d;border-color:#e0322d;color:#fff;font-weight:600;}
151            </style>
152            <div class="axis-selector" id="axisSelector">
153              <span class="axis-label">Parecidas por:</span>
154              <button type="button" class="axis-pill active" data-axis="feel">Feel</button>
155              <button type="button" class="axis-pill" data-axis="vibe">Sinopsis</button>
156              <button type="button" class="axis-pill" data-axis="genre">Género</button>
157              <button type="button" class="axis-pill" data-axis="year">Año</button>
158              <button type="button" class="axis-pill" data-axis="author">Autor</button>
159            </div>
160            <button id="searchButton" class="search-button">Find movies</button>
161            <div class="search-results" id="searchResults"></div>
162        </div>
163        
164        <div class="stats">
165            <p><span class="stat-number"></span> recommendations made </p>
166            <p><span class="stat-number"></span>

166 search hours saved </p>
167        </div>
168    </main>
169    <section class="latest-recommendations">
170        <h3>Daily recommends</h3>
171        <div class="movie-carousel">
172            <div class="movie-container" id="movieContainer">
173                <!-- Movie cards will be dynamically inserted here -->
174            </div>
175            <button class="scroll-button scroll-left" id="scrollLeft">
176                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
177                    <path d="M9.1736 7.00005C8.98735 7.18741 8.88281 7.44087 8.88281 7.70505C8.88281 7.96924 8.98735 8.22269 9.1736 8.41005L12.7136 12.0001L9.1736 15.5401C8.98735 15.7274 8.88281 15.9809 8.88281 16.2451C8.88281 16.5092 8.98735 16.7627 9.1736 16.9501C9.26657 17.0438 9.37717 17.1182 9.49903 17.1689C9.62089 17.2197 9.75159 17.2458 9.88361 17.2458C10.0156 17.2458 10.1463 17.2197 10.2682 17.1689C10.39 17.1182 10.5006 17.0438 10.5936 16.9501L14.8336 12.7101C14.9273 12.6171 15.0017 12.5065 15.0525 12.3846C15.1033 12.2628 15.1294 12.1321 15.1294 12.0001C15.1294 11.868 15.1033 11.7373 15.0525 11.6155C15.0017 11.4936 14.9273 11.383 14.8336 11.2901L10.5936 7.00005C10.5006 6.90632 10.39 6.83193 10.2682 6.78116C10.1463 6.73039 10.0156 6.70425 9.88361 6.70425C9.75159 6.70425 9.62089 6.73039 9.49903 6.78116C9.37717 6.83193 9.26657 6.90632 9.1736 7.00005Z" fill="black"/>
178                </svg>
179            </button>
180            <button class="scroll-button scroll-right" id="scrollRight">
181                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
182                    <path d="M9.1736 7.00005C8.98735 7.18741 8.88281 7.44087 8.88281 7.70505C8.88281 7.96924 8.98735 8.22269 9.1736 8.41005L12.7136 12.0001L9.1736 15.5401C8.98735 15.7274 8.88281 15.9809 8.88281 16.2451C8.88281 16.5092 8.98735 16.7627 9.1736 16.9501C9.26657 17.0438 9.37717 17.1182 9.49903 17.1689C9.62089 17.2197 9.75159 17.2458 9.88361 17.2458C10.0156 17.2458 10.1463 17.2197 10.2682 17.1689C10.39 17.1182 10.5006 17.0438 10.5936 16.9501L14.8336 12.7101C14.9273 12.6171 15.0017 12.5065 15.0525 12.3846C15.1033 12.2628 15.1294 12.1321 15.1294 12.0001C15.1294 11.868 15.1033 11.7373 15.0525 11.6155C15.0017 11.4936 14.9273 11.383 14.8336 11.2901L10.5936 7.00005C10.5006 6.90632 10.39 6.83193 10.2682 6.78116C10.1463 6.73039 10.0156 6.70425 9.88361 6.70425C9.75159 6.70425 9.62089 6.73039 9.49903 6.78116C9.37717 6.83193 9.26657 6.90632 9.1736 7.00005Z" fill="black"/>
183                </svg>
184            </button>
185        </div>
186        <div class="pagination" id="pagination">
187            <!-- Pagination dots will be dynamically inserted here -->
188        </div>
189    </section>
190    <section class="faq-section">
191        <h3>Frequently asked questions</h3>
192        <div class="faq-list">
193            <div class="faq-item">
194                <div class="faq-question">
195                    How to find new movies to watch?
196                    <span class="faq-toggle">
197                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
198                            <path d="M7.41 8.59L12 13.17L16.59 8.59L18 10L12 16L6 10L7.41 8.59Z" fill="currentColor"/>
199                        </svg>
200                    </span>
201                </div>
202                <div class="faq-answer">
203                    <p>To find new movies to watch, you can use our AI-powered recommendation system. Simply enter a movie you've enjoyed in the search bar, and we'll suggest similar films based on various factors such as genre, director, actors, and themes. You can also use the "Description" mode to describe the type of movie you're in the mood for, and we'll provide tailored recommendations.</p>
204                </div>
205            </div>
206            <div class="faq-item">
207                <div class="faq-question">
208                    How does movierecs.ai help me pick a movie?
209                    <span class="faq-toggle">
210                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
211                            <path d="M7.41 8.59L12 13.17L16.59 8.59L18 10L12 16L6 10L7.41 8.59Z" fill="currentColor"/>
212                        </svg>
213                    </span>
214                </div>
215                <div class="faq-answer">
216                    <p>Movierecs.ai uses advanced AI algorithms to analyze your movie preferences and viewing history. By comparing your tastes with our vast database of films, we can suggest movies that you're likely to enjoy. Our system takes into account factors like genre, plot elements, critical reception, and user ratings to provide personalized recommendations.

216</p>
217                </div>
218            </div>
219            <div class="faq-item">
220                <div class="faq-question">
221                    How many movies are in the database to recommend from?
222                    <span class="faq-toggle">
223                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
224                            <path d="M7.41 8.59L12 13.17L16.59 8.59L18 10L12 16L6 10L7.41 8.59Z" fill="currentColor"/>
225                        </svg>
226                    </span>
227                </div>
228                <div class="faq-answer">
229                    <p>Our database has been curated with over 30,000 movies from various genres, countries, and time periods. This extensive collection allows us to provide diverse and comprehensive recommendations to suit all tastes and preferences.</p>
230                </div>
231            </div>
232            <div class="faq-item">
233                <div class="faq-question">
234                    What filters can I use to pick a recommended movie?
235                    <span class="faq-toggle">
236                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
237                            <path d="M7.41 8.59L12 13.17L16.59 8.59L18 10L12 16L6 10L7.41 8.59Z" fill="currentColor"/>
238                        </svg>
239                    </span>
240                </div>
241                <div class="faq-answer">
242                    <p>You can use various filters to refine your movie recommendations, including:
243                    <ul>
244                        <li>Genre (e.g., Action, Comedy, Drama)</li>
245                        <li>Release year or range</li>
246                        <li>MPAA rating (e.g., G, PG, PG-13, R)</li>
247                        <li>Language</li>
248                        <li>Director or actor</li>
249                        <li>User rating threshold</li>
250                        <li>Runtime</li>
251                    </ul>
252                    These filters help you narrow down the recommendations to find the perfect movie for your mood and preferences.</p>
253                </div>
254            </div>
255        </div>
256    </section>
257    <section class="popular-categories">
258        <h3>Popular movie recommendations</h3>
259        <h3>Movie recs by category</h3>
260        <div class="category-grid" id="categoryGrid">
261            <!-- Category cards will be dynamically inserted here -->
262        </div>
263        <h3>Movie recs by year produced</h3>
264        <div class="category-grid" id="yearGrid"></div>
265            <!-- Category cards will be dynamically inserted here -->
266        </div>
267        <h3>Movie recs by country</h3>
268        <div class="category-grid" id="countryGrid"></div>
269            <!-- Category cards will be dynamically inserted here -->
270        </div>
271    </section>
272    <footer>
273        <div class="footer-content">
274            <div class="footer-logo">
275                <a href="https://www.movierecs.ai" target="_blank" rel="noopener noreferrer">
276                    <img src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Screenshot_2024-10-10_at_01.57.53-removebg-m7eaY9cC6JEcj45s7y9vIXzW0qbNgv.png" alt="MOVIERECS.AI Logo" class="logo-image">
277                </a>
278            </div>
279            <p class="footer-text">Made for you to save time and enjoy great movies ❤️</p>
280            <!-- <a href="#" onclick="shareContent(); return false;">
281                <img src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Share%20button-DOCW44AtTP1NOB4vKYrqVafMSUOcpy.png" alt="Share" class="footer-share-icon">
282            </a> -->
283            <p class="footer-powered-by">This product uses the TMDB API but is not endorsed or certified by TMDB.</p>
284            <a href="https://aitooltrek.com" title="AI Tool Trek">AI Tool Trek</a>
285            <a href="https://aistage.net" title="AIStage">AIStage</a>
286        </div>
287    </footer>
288    

288<script type="module" src="script.js"></script>

288
289    

289<script src="/i18n.js" defer></script>

289
290</body>
291</html>