https://www.myownmusic.de/

1<!DOCTYPE html>
2<html lang="de">
3<head>
4	<meta charset="utf-8">
5	<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
6	<meta name="theme-color" content="#f5f5f7" media="(prefers-color-scheme: light)" />
7	<meta name="theme-color" content="#000000" media="(prefers-color-scheme: dark)" />
8	

8<script>(function(){try{var m=document.cookie.match(/(?:^|; )mom-theme=([^;]+)/);if(m)document.documentElement.setAttribute('data-theme',decodeURIComponent(m[1]));}catch(e){}})();</script>

8
9	<title>MyOwnMusic — Deine Musik. Deine Bühne.</title>
10	<meta name="description" content="Lade deine Musik hoch, erreiche echte Hörer und bekomme ehrliches Feedback. GEMA-frei und kostenlos — seit 1997." />
11	<meta name="google-site-verification" content="-dlMzGbkMHerFiHPr25ts_SiFBDadsfCRG41NSU-nrU" />
12        <link rel="stylesheet" href="/index_animate.css?version=1648646891">
13        <link rel="stylesheet" href="/css/page.css?version=1790584075" />
14        

14<script> if (window.localStorage) { for (var i = localStorage.length - 1; i >= 0; i--) { var k = localStorage.key(i); if (k && k.indexOf('mom.') !== 0) localStorage.removeItem(k); } } </script>

14
15        <link rel="stylesheet" href="/css/fontawesome/css/font-awesome-4.3.0.css"/>
16        <link rel="icon" href="/img/favicon.png" type="image/png" />
17        <link rel="preconnect" href="https://fonts.googleapis.com" />
18        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
19        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Michroma&display=swap" />
20        <!-- Cookie Consent by https://www.FreePrivacyPolicy.com -->
21    

21<script type="text/javascript" src="//www.freeprivacypolicy.com/public/cookie-consent/4.0.0/cookie-consent.js" charset="UTF-8"></script>

21
22    

22<script type="text/javascript" charset="UTF-8">
23    document.addEventListener('DOMContentLoaded', function () {
24    cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palette":"dark","language":"de","page_load_consent_levels":["strictly-necessary"],"notice_banner_reject_button_hide":false,"preferences_center_close_button_hide":false,"page_refresh_confirmation_buttons":false,"website_name":"MyOwnMusic.de","website_privacy_policy_url":"https://www.myownmusic.de/info/about/legal/data_privacy_statement"});
25    });
26    </script>

26
27    <!-- Google Analytics -->

27
28    <script type="text/plain" cookie-consent="targeting" async src="https://www.googletagmanager.com/gtag/js?id=

28G-GM4PR2DPHK

28"></script>
29    

29<script type="text/plain" cookie-consent="targeting">
30    

30window.dataLayer = window.dataLayer || [];
31    function gtag(){dataLayer.push(arguments);}
32    gtag('js', new Date());
33    gtag('config', '

33G-GM4PR2DPHK

33');
34    

34</script>

34
35    <noscript>Cookie Consent by <a href="https://www.freeprivacypolicy.com/" rel="nofollow noopener">Free Privacy Policy Generator website</a></noscript>
36    

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

36
37        <style>
38            .freeprivacypolicy-com---nb .cc-nb-main-container { padding: 3rem; background-color: #777; }
39            .freeprivacypolicy-com---palette-dark .cc-nb-okagree { color: #000; background-color: #EEC54A !important; }
40            .freeprivacypolicy-com---palette-dark .cc-nb-reject { color: #000; background-color: #EEC54A !important; }
41
42            /* ===== Apple-style landing hero (theme-aware) ===== */
43            html { box-sizing: border-box; }
44            *, *::before, *::after { box-sizing: border-box; }
45            body { margin: 0; background: var(--bg); color: var(--text); }
46
47            .mom-hero { position: relative; overflow: hidden; padding: clamp(48px, 8vw, 128px) 0 clamp(40px, 6vw, 80px); }
48            .mom-hero__glow { position: absolute; z-index: 0; top: -30%; left: 50%; transform: translateX(-50%);
49                width: min(1100px, 120vw); height: 780px; pointer-events: none;
50                background: radial-gradient(closest-side, var(--accent-soft), transparent 72%); opacity: .9; }
51            .mom-hero__inner { position: relative; z-index: 1; max-width: var(--container); margin: 0 auto;
52                padding: 0 var(--gutter); display: grid; gap: clamp(36px, 5vw, 72px); grid-template-columns: 1fr; align-items: center; }
53            @media (min-width: 920px) { .mom-hero__inner { grid-template-columns: 1.08fr .92fr; } }
54
55            .mom-hero__title { margin: 0; font-family: var(--font); font-weight: 700;
56                font-size: clamp(2.6rem, 6.4vw, 4.6rem); line-height: 1.03; letter-spacing: -0.03em; color: var(--text); }
57            .mom-hero__title .accent { background: linear-gradient(120deg, var(--gold-hi), var(--gold-lo));
58                -webkit-background-clip: text; background-clip: text; color: transparent; }
59            .mom-hero__sub { margin: var(--sp-5) 0 0; font-size: clamp(1.05rem, 1.7vw, 1.3rem); line-height: 1.5;
60                color: var(--text-2); max-width: 36ch; }
61            .mom-hero__cta { margin-top: var(--sp-8); display: flex; flex-wrap: wrap; gap: var(--sp-3); }
62            .mom-hero__meta { margin-top: var(--sp-6); font-size: var(--fs-sm); color: var(--text-3); }
63
64            .mom-login { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-2xl);
65                box-shadow: var(--shadow-3); padding: clamp(24px, 3vw, 40px); }
66            .mom-login h2 { margin: 0 0 var(--sp-2); font-size: var(--fs-2xl); font-weight: 700; letter-spacing: -0.02em; }
67            .mom-login p.sub { margin: 0 0 var(--sp-6); color: var(--text-2); font-size: var(--fs-base); }
68            .mom-login form { margin: 0; }
69            .mom-login label { display: block; margin: 0 0 var(--sp-2); font-size: var(--fs-sm); font-weight: 600; color: var(--text-2); }
70            .mom-login .field { margin-bottom: var(--sp-4); }
71            .mom-login .remember { display: flex; align-items: center; gap: var(--sp-2); margin: var(--sp-2) 0 var(--sp-5); font-size: var(--fs-sm); color: var(--text-2); }
72            .mom-login-links { margin-top: var(--sp-5); display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); font-size: var(--fs-sm); }
73            .mom-login-links a { color: var(--accent-hover); font-weight: 500; }
74
75            /* Feature highlights */
76            .mom-features { max-width: var(--container); margin: 0 auto; padding: clamp(24px,4vw,64px) var(--gutter) clamp(48px,7vw,96px);
77                display: grid; gap: var(--sp-5); grid-template-columns: 1fr; }
78            @media (min-width: 760px) { .mom-features { grid-template-columns: repeat(3, 1fr); gap: var(--sp-6); } }
79            .mom-feature { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-xl);
80                padding: var(--sp-8) var(--sp-6); box-shadow: var(--shadow-1); }
81            .mom-feature__icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px;
82                border-radius: var(--r-lg); background: var(--accent-soft); color: var(--accent-hover); font-size: 22px; margin-bottom: var(--sp-4); }
83            .mom-feature h3 { margin: 0 0 var(--sp-2); font-size: var(--fs-lg); font-weight: 600; }
84            .mom-feature p { margin: 0; color: var(--text-2); font-size: var(--fs-base); }
85
86            /* Landing footer */
87            .mom-landing-footer { max-width: var(--container); margin: 0 auto; padding: var(--sp-8) var(--gutter) var(--sp-16);
88                border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: var(--sp-3) var(--sp-5);
89                align-items: center; font-size: var(--fs-sm); color: var(--text-3); }
90            .mom-landing-footer a { color: var(--text-2); } .mom-landing-footer a:hover { color: var(--text); }
91            .mom-landing-footer .sep { margin-left: auto; }
92            @media (max-width: 640px) { .mom-landing-footer { justify-content: center; text-align: center; } .mom-landing-footer .sep { margin: 0; width: 100%; } }
93        </style>
94</head>
95<body>
96<div class="mom-overlay" id="momOverlay"></div>
97<aside class="mom-drawer" id="momDrawer" aria-hidden="true">
98    <div class="mom-drawer-head">
99        <a href="/"><img class="mom-logo" src="/img/logo/mom_logo_star.svg?v=1786167064" alt="MyOwnMusic" /></a>
100        <button type="button" class="mom-drawer-close" id="momDrawerClose" aria-label="Menü schließen">&times;</button>
101    </div>
102    <nav>
103        <div class="mom-drawer-label">Konto</div>
104        <a href="/account/"><i class="fa fa-sign-in"></i> Anmelden</a>
105        <a href="/register/"><i class="fa fa-user-plus"></i> Kostenlos registrieren</a>
106        <div class="mom-drawer-label">Entdecken</div>
107        <a href="/charts/"><i class="fa fa-line-chart"></i> Charts</a>
108        <a href="/player/radio" onclick="return typeof openPlayer==='function'?openPlayer($(this)):true"><i class="fa fa-headphones"></i> Radio</a>
109        <a href="/Allgemein/news"><i class="fa fa-newspaper-o"></i> Magazin</a>
110        <a href="/help/"><i class="fa fa-question-circle"></i> Hilfe</a>
111        <a href="https://mom-shop.myspreadshop.de" target="_blank" rel="noopener"><i class="fa fa-shopping-cart"></i> Shop</a>
112        <div class="mom-drawer-label">Genres</div>
113        <a href="/Electro/">Electro</a>
114        <a href="/HipHop/">

114HipHop</a>
115        <a href="/Rock/">Rock</a>
116        <a href="/Metal/">Metal</a>
117        <a href="/Pop/">Pop</a>
118        <a href="/Chillout/">Chillout</a>
119        <a href="/Various/">Various</a>
120    </nav>
121</aside>
122<header class="mom-header" id="momHeader">
123    <div class="mom-header__bar">
124        <button type="button" class="mom-iconbtn mom-burger" id="momBurger" aria-label="Menü" aria-controls="momDrawer" aria-expanded="false"><i class="fa fa-bars"></i></button>
125        <a class="mom-header__logo" href="/"><img class="mom-logo" src="/img/logo/mom_logo_star.svg?v=1786167064" alt="MyOwnMusic" /><span class="mom-header__brand">MyOwnMusic</span></a>
126        <nav class="mom-header__nav" aria-label="Hauptnavigation">
127            <a href="/charts/">Charts</a>
128            <a href="/player/radio" onclick="return typeof openPlayer==='function'?openPlayer($(this)):true">Radio</a>
129            <a href="/Allgemein/news">Magazin</a>
130            <a href="https://mom-shop.myspreadshop.de" target="_blank" rel="noopener">Shop</a>
131            <a href="/help/">Hilfe</a>
132        </nav>
133        <span class="mom-header__spacer"></span>
134        <div class="mom-header__search"><form method="post" autocomplete="off" action="/search/">
135       <div id="search">
136           <input id="searchField" type="text" name="search" placeholder="suchen" class="input_field"/>
137           <button type="submit" name="go" value="1" class="send" aria-label="suchen"><i class="fa fa-search"></i></button>
138           <div id="searchBox">
139               <div class="sbtitle">
140                   <i class="fa fa-cog"></i>&nbsp;Suchoptionen
141               </div>
142               <div class="options">
143                   <label class="songs"><input id="searchSongs" type="checkbox" name="stype" value="songs"/> Nach Songs</label>
144                   <label class="artists"><input id="searchArtists" type="checkbox" name="stype" value="artists"/> Nach Künstler</label>
145               </div>
146           </div>
147           <div class="clear"></div>
148       </div>
149</form>

150<script type="text/javascript">
151    window.onload = function() {
152        $(document).ready(function(){
153            $('#searchField').click(function(){
154                $('#searchBox').show('fast',function(){
155                    if(!$('#searchArtists').is(":checked") && !$('#searchSongs').is(":checked")) {
156                        $('#searchArtists').attr('checked', true); 
157                    }
158                });
159            });
160            
161            $('#searchSongs').click(function(){
162               $('#searchArtists').attr('checked', false); 
163            });
164            
165            $('#searchArtists').click(function(){
166               $('#searchSongs').attr('checked', false); 
167            });
168        });
169        
170        $(document).mouseup(function (e)
171        {
172            var container = $('#searchBox');
173            var search = $('#searchField');
174            
175            if ((!search.is(e.target) && !container.is(e.target)) // if the target of the click isn't the container...
176                && container.has(e.target).length === 0) // ... nor a descendant of the container
177            {
178                container.hide();
179            }
180        });
181    };
182    
183    
184    
185</script>

185
186
187
188
189</div>
190        <button type="button" class="mom-iconbtn mom-theme-toggle" id="momTheme" aria-label="Design wechseln"><i class="fa fa-adjust"></i></button>
191        <a class="mom-login-btn" href="/register/">Registrieren</a>
192    </div>
193    <div class="mom-header__genres">
194        <ul class="mom-genres">
195            <li><a href="/Electro/">Electro</a></li>
196            <li><a href="/HipHop/">HipHop</a></li>
197            <li><a href="/Rock/">Rock</a></li>
198            <li><a href="/Metal/">Metal</a></li>
199            <li><a href="/Pop/">Pop</a></li>
200            <li><a href="/Chillout/">Chillout</a></li>
201            <li><a href="/World/">World</a></li>
202            <li><a href="/Various/">Various</a></li>
203        </ul>
204    </div>
205</header>

206<script>
207document.addEventListener('DOMContentLoaded',function(){
208    var b=document.getElementById('momBurger'),d=document.getElementById('momDrawer'),
209        o=document.getElementById('momOverlay'),c=document.getElementById('momDrawerClose'),t=document.getElementById('momTheme');
210    function open(){d.classList.add('is-open');o.classList.add('is-open');document.body.classList.add('mom-drawer-open');if(b)b.setAttribute('aria-expanded','true');d.setAttribute('aria-hidden','false');}
211    function close(){d.classList.remove('is-open');o.classList.remove('is-open');document.body.classList.remove('mom-drawer-open');if(b)b.setAttribute('aria-expanded','false');d.setAttribute('aria-hidden','true');}
212    if(b&&d&&o){ b.addEventListener('click',open); o.addEventListener('click',close); if(c)c.addEventListener('click',close); document.addEventListener('keydown',function(e){if(e.key==='Escape')close();}); }
213    if(t){ t.addEventListener('click',function(){ var cur=document.documentElement.getAttribute('data-theme')||((window.matchMedia&&matchMedia('(prefers-color-scheme: dark)').matches)?'dark':'light'); var next=cur==='dark'?'light':'dark'; document.documentElement.setAttribute('data-theme',next); document.cookie='mom-theme='+next+';path=/;max-age=31536000'; }); }
214});
215</script>

215
216
217<main>
218    <section class="mom-hero">
219        <div class="mom-hero__glow"></div>
220        <div class="mom-hero__inner">
221            <div class="mom-hero__copy animated fadeInUp">
222                <h1 class="mom-hero__title">Deine Musik.<br><span class="accent">Deine Bühne.</span></h1>
223                <p class="mom-hero__sub">Lade deine Tracks hoch, erreiche echte Hörer und bekomme ehrliches Feedback von einer Community aus Musikern.</p>
224                <div class="mom-hero__cta">
225                    <a class="btn btn-primary btn-lg" href="/register/">Kostenlos loslegen</a>
226                    <a class="btn btn-outline btn-lg" href="/player/radio" onclick="return typeof openPlayer==='function'?openPlayer($(this)):true">Musik entdecken</a>
227                </div>
228                <p class="mom-hero__meta">Über 370.000 Songs · tausende Künstler · komplett kostenlos</p>
229            </div>
230            <div class="mom-hero__card animated fadeInUp">
231                <div class="mom-login">
232                    <h2>Willkommen zurück</h2>
233                    <p class="sub">Melde dich in deinem Account an.</p>
234                    <form method="post" autocomplete="off" action="/account/">
235                        <div class="field">
236                            <label for="username">Account</label>
237                            <input type="text" id="username" value="" name="nick" />
238                        </div>
239                        <div class="field">
240                            <label for="password">Passwort</label>
241                            <input type="password" id="password" name="pass" />
242                        </div>
243                        <label class="remember"><input type="checkbox" name="cookie_act" value="yes" /> Nutzernamen merken</label>
244                        <button type="submit" class="btn btn-primary btn-block">Login</button>
245                    </form>
246                    <div class="mom-login-links">
247                        <a href="/register/forgot">Passwort vergessen?</a>
248                        <a href="/register/">Neu anmelden</a>
249                    </div>
250                </div>
251            </div>
252        </div>
253    </section>
254
255    <section class="mom-features">
256        <div class="mom-feature">
257            <span class="mom-feature__icon"><i class="fa fa-cloud-upload"></i></span>
258            <h3>Hochladen &amp; teilen</h3>
259            <p>Veröffentliche deine Songs, Alben und Videos in Minuten — mit unbegrenztem Speicher im Club.</p>
260        </div>
261        <div class="mom-feature">
262            <span class="mom-feature__icon"><i class="fa fa-headphones"></i></span>
263            <h3>Musik entdecken</h3>
264            <p>Charts, Empfehlungen, Radio und Genres von Electro bis Metal — immer neue Tracks von echten Künstlern.</p>
265        </div>
266        <div class="mom-feature">
267            <span class="mom-feature__icon"><i class="fa fa-users"></i></span>
268            <h3>Community &amp; Feedback</h3>
269            <p>Bewertungen, Kommentare, Freunde und Fans — ehrliches Feedback, das dich weiterbringt.</p>
270        </div>
271    </section>
272
273    <footer class="mom-landing-footer">
274        <a href="/info/about/">Über uns</a>
275        <a href="/info/support">Support</a>
276        <a href="/info/impressum">Impressum</a>
277        <a href="/info/about/legal/agb">AGB</a>
278        <a href="/info/about/legal/data_privacy_statement">Datenschutz</a>
279        <span class="sep">&copy; 1997 – 2026 MyOwnMusic</span>
280    </footer>
281</main>

282<script src="/extern/jquery-main/jquery-3.3.1.js"></script>

282
283</body>
284</html>