2022-04-19 11:53:52 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0, shrink-to-fit=no" >
< title > RetroDeck< / title >
< meta name = "twitter:description" content = "RetroDeck is an easy and fancy environment for managing and launching your retro games on Steam Deck without relying on custom firmware." >
< meta name = "twitter:card" content = "summary" >
< meta property = "og:type" content = "website" >
< meta name = "description" content = "RetroDeck is an easy and fancy environment for managing and launching your retro games on Steam Deck without relying on custom firmware." >
< meta property = "og:image" content = "assets/img/RetroDeck%20Wallpaper.png" >
< meta name = "twitter:title" content = "RetroDeck" >
< link rel = "apple-touch-icon" type = "image/png" sizes = "180x180" href = "assets/img/RD_180x180.png" >
< link rel = "icon" type = "image/png" sizes = "16x16" href = "assets/img/RD_16x16.png" >
< link rel = "icon" type = "image/png" sizes = "32x32" href = "assets/img/RD_32x32.png" >
< link rel = "icon" type = "image/png" sizes = "180x180" href = "assets/img/RD_180x180.png" >
< link rel = "icon" type = "image/png" sizes = "192x192" href = "assets/img/RD_192x192.png" >
< link rel = "icon" type = "image/png" sizes = "512x512" href = "assets/img/RD_512x512.png" >
< link rel = "stylesheet" href = "assets/bootstrap/css/bootstrap.min.css" >
< link rel = "stylesheet" href = "https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600&display=swap" >
< link rel = "stylesheet" href = "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700" >
< link rel = "stylesheet" href = "assets/fonts/fontawesome-all.min.css" >
< link rel = "stylesheet" href = "assets/fonts/font-awesome.min.css" >
< link rel = "stylesheet" href = "assets/fonts/ionicons.min.css" >
< link rel = "stylesheet" href = "assets/fonts/fontawesome5-overrides.min.css" >
< link rel = "stylesheet" href = "assets/css/Features-Clean.css" >
< link rel = "stylesheet" href = "assets/css/Footer-Basic.css" >
< link rel = "stylesheet" href = "assets/css/Header-Blue.css" >
< link rel = "stylesheet" href = "assets/css/Highlight-Blue.css" >
< link rel = "stylesheet" href = "assets/css/Highlight-Clean.css" >
2022-04-20 02:37:34 +00:00
< link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.css" >
2022-04-19 11:53:52 +00:00
< link rel = "stylesheet" href = "assets/css/Navigation-Clean.css" >
< link rel = "stylesheet" href = "assets/css/styles.css" >
< / head >
< body >
<!-- Start: Navigation Clean -->
< nav class = "navbar navbar-light navbar-expand-lg sticky-top navigation-clean" >
< div class = "container" > < a class = "navbar-brand" href = "#top" > < img src = "assets/img/icon128.png" style = "width: 45px;" > < / a > < button data-bs-toggle = "collapse" class = "navbar-toggler" data-bs-target = "#navcol-1" > < span class = "visually-hidden" > Toggle navigation< / span > < span class = "navbar-toggler-icon" > < / span > < / button >
< div class = "collapse navbar-collapse" id = "navcol-1" >
< ul class = "navbar-nav ms-auto" >
< li class = "nav-item" > < a class = "nav-link" href = "#top" style = "color: rgb(49,52,55);" > Home< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "#features" style = "color: rgb(49,52,55);" > features< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "#" style = "color: rgb(49,52,55);" > wiki< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "https://github.com/XargonWan/RetroDECK-cooker/" style = "color: rgb(49,52,55);" target = "_blank" > cooker< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "https://github.com/XargonWan/RetroDECK" target = "_blank" style = "color: rgb(49,52,55);" > github< / a > < / li >
< li class = "nav-item" > < a class = "nav-link" href = "https://discord.gg/tbmBpJbpur" target = "_blank" style = "color: rgb(49,52,55);" > connect with us< / a > < / li >
< / ul >
< / div >
< / div >
< / nav > <!-- End: Navigation Clean -->
<!-- Start: Highlight Clean -->
< section class = "d-flex d-md-flex align-items-center align-items-md-center highlight-clean" id = "top" style = "height: 550px;background: #000000;" >
< div class = "container" >
<!-- Start: Intro -->
< div class = "intro" >
< h2 class = "text-center" style = "font-size: 60px;margin-bottom: 0px;" > < img class = "img-fluid" src = "assets/img/SSLM.png" style = "margin-bottom: 25px;" > < / h2 >
< p class = "text-center" style = "font-size: 20px;color: rgb(218,218,218);" > RetroDeck is an easy and fancy environment for managing and launching your retro games on Steam Deck without relying on custom firmware. < / p >
< / div > <!-- End: Intro -->
<!-- Start: Buttons -->
2022-04-20 02:37:34 +00:00
< div class = "buttons" style = "margin-bottom: 0px;" > < a class = "btn btn-secondary" role = "button" target = "_blank" style = "color: black;background: white;border-top-left-radius: 5px;border-top-right-radius: 5px;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;" href = "https://github.com/XargonWan/RetroDECK/releases" > < i class = "fas fa-download" > < / i > Get retrodeck< / a > < / div > <!-- End: Buttons -->
2022-04-19 11:53:52 +00:00
< / div >
< / section > <!-- End: Highlight Clean -->
<!-- Start: Highlight Clean -->
< section class = "highlight-clean" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);" >
< div class = "container" >
<!-- Start: Intro -->
< div class = "intro" style = "margin-bottom: 0px;" >
< h2 class = "text-center" style = "color: rgb(255,255,255);" > POWERED BY EMULATIONSTATION-DE< br > < / h2 >
< p class = "text-center" style = "color: rgb(255,255,255);margin-bottom: 0px;" > RetroDeck teamed up with ES-DE to bring you the best retro launcher out there!< br > < / p >
< / div > <!-- End: Intro -->
< / div >
< / section > <!-- End: Highlight Clean -->
<!-- Start: Features Clean -->
< section id = "features" class = "features-clean" >
< div class = "container" >
<!-- Start: Intro -->
< div class = "intro" >
< h2 class = "text-center" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > designed for you< / h2 >
< / div > <!-- End: Intro -->
<!-- Start: Features -->
< div class = "row justify-content-center features" >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-play-circle icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > ready, set, go!< / h3 >
< p class = "description" > No configuration, just play!< / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-exchange-alt icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > < strong > instant pickup< / strong > < / h3 >
< p class = "description" > Close your game? No worries! Pick up exactly where you left off!< / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-backward icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > < strong > rewind< / strong > < / h3 >
< p class = "description" > Seems like you died! Go back in time and retry without having to restart your game or lose a life. < em > (Must be manually enabled during the beta)< / em > < / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-ghost icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > < strong > cheats< / strong > < / h3 >
< p class = "description" > Wanna be that guy? You can.< / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-wifi icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > online gaming < em > (Coming soon)< / em > < br > < / h3 >
< p class = "description" > Thanks to RetroArch's Netplay you will be able to play online with your friends, stay tuned for this feature!< br > < / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-database icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > < strong > metadata< / strong > < / h3 >
< p class = "description" > RetroDeck pulls information from your library to create a beautiful user experience!< br > < / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-cloud-download-alt icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > < strong > cloud saves < em > (coming soon)< / em > < / strong > < / h3 >
< p class = "description" > RetroDeck will backup your progression and sync it across multiple devices. < em > (User configuration may be needed)< / em > < br > < / p >
< / div >
< div class = "col-sm-6 col-lg-4 item" > < i class = "fas fa-medal icon" style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > < / i >
< h3 class = "name" > Retro Achievements< / h3 >
< p class = "description" > Get rewarded while you play! RetroDeck tracks your progress and awards you when you go the extra mile.< / p >
< / div >
< / div > <!-- End: Features -->
< / div >
< / section > <!-- End: Features Clean -->
2022-04-20 02:37:34 +00:00
<!-- Start: Lightbox Gallery -->
< section class = "photo-gallery py-4 py-xl-5" >
< div class = "container" >
< div class = "row mb-5" >
< div class = "col-md-8 col-xl-6 text-center mx-auto" >
< h2 style = "background: linear-gradient(-95deg, #1a9fff, #946beb);-webkit-background-clip: text;-webkit-text-fill-color: transparent;" > screenshots< / h2 >
< / div >
< / div > <!-- Start: Photos -->
< div class = "row gx-2 gy-2 row-cols-1 row-cols-md-2 row-cols-xl-3 photos" data-bss-baguettebox = "" >
2022-04-20 07:44:34 +00:00
< div class = "col item" > < a > < img class = "img-fluid" src = "https://github.com/XargonWan/RetroDECK/blob/main/res/screenshots/screen02.png" > < / a > < / div >
< div class = "col item" > < a > < img class = "img-fluid" src = "https://github.com/XargonWan/RetroDECK/blob/main/res/screenshots/screen04.jpeg" > < / a > < / div >
< div class = "col item" > < a > < img class = "img-fluid" src = "https://github.com/XargonWan/RetroDECK/blob/main/res/screenshots/screen05.jpeg" > < / a > < / div >
2022-04-20 02:37:34 +00:00
< / div > <!-- End: Photos -->
< / div >
< / section > <!-- End: Lightbox Gallery -->
2022-04-19 11:53:52 +00:00
<!-- Start: Footer Basic -->
< footer class = "footer-basic" >
<!-- Start: Social Icons -->
< div class = "social" > < a href = "https://discord.gg/tbmBpJbpur" target = "_blank" > < i class = "fab fa-discord" > < / i > < / a > < a href = "https://github.com/XargonWan/RetroDECK" target = "_blank" > < i class = "icon ion-social-github" > < / i > < / a > < / div > <!-- End: Social Icons -->
<!-- Start: Copyright -->
< p class = "copyright" > Made with < i class = "fa fa-heart" > < / i > by gabeee_boii#5232< / p > <!-- End: Copyright -->
< / footer > <!-- End: Footer Basic -->
< script src = "assets/bootstrap/js/bootstrap.min.js" > < / script >
2022-04-20 02:37:34 +00:00
< script src = "https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.11.1/baguetteBox.min.js" > < / script >
< script src = "assets/js/Lightbox-Gallery.js" > < / script >
2022-04-19 11:53:52 +00:00
< script src = "assets/js/scroll.js" > < / script >
< / body >
< / html >