1
0
Fork 0
mirror of https://github.com/safing/web synced 2025-04-09 13:39:09 +00:00
safing-web/spn/index.html
2024-09-13 06:31:52 +00:00

230 lines
13 KiB
HTML

---
title: Safing Portmaster - SPN Features
layout: page
---
<section class="general-layout">
<div class="space-y-28">
<div class="intro-container" id="features">
<div class="alert max-w-xl bg-transparent mx-auto" style="display: flex; align-items: center; max-height: 60px;">
<div class="horizontal-line" style="height: 2px;"></div>
<a class="link text-xl text-center text-white" href="{{ site.pricing_url }}" style="width: 100%; min-width: 205px;">
<div style="align-items: center; display: flex; max-width: max-content;">
<span class="block"> Get Portmaster<span style="color: #029ad0;"> Pro </span></span>
<img src="{{ site.img_url }}page-specific/pricing/package-icons/triangle.png" style="width: 19px; height: 19px; display: inline-block;" alt="">
</div>
</a>
<div class="horizontal-line" style="height: 2px;"></div>
</div>
<h2 class="intro-container-title" style="margin-top: 1rem;">
It's Time to Ditch VPNs
</h2>
<p class="intro-container-desc">
Stop paying for out-dated technology that was never intended to protect your privacy. Get peace of mind with <span tooltip="Safing Privacy Network">SPN <i class="icon-info text-sm"></i></span>. Built from scratch and designed to truly protect your privacy from mass surveillance.
</p>
</div>
<div class="showcase-one-container-reverse">
<div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/multiple-identities-for-each-app.png" alt="">
</div>
<div class="showcase-one-right">
<h2 class="showcase-one-right-title" style="max-width: 450px;" id="get-multiple-identities">
Get Multiple Identities for Each App
</h2>
<p class="showcase-one-right-desc">
Automatically get a vast amount of identities (IP addresses). The <span tooltip="Safing Privacy Network">SPN <i class="icon-info text-sm mr-1"></i></span> calculates an individual path for every connection through the privacy network. Spread your connections across the globe, without any effort.
</p>
</div>
</div>
</div>
<div class="showcase-one-container">
<div class="showcase-one-left" style="max-width: 950px;">
<img src="{{ site.img_url }}page-specific/spn/easily-control-your-privacy.png" alt="">
</div>
<div class="showcase-one-right">
<h2 class="showcase-one-right-title" style="max-width: 350px;" id="easily-adjust-your-privacy">
Easily Adjust Your Privacy
</h2>
<p class="showcase-one-right-desc">
SPN just works and does the heavy lifting for you. But of course you can easily configure the settings, so it fits your needs: Exclude certain apps and domains from the <span tooltip="Safing Privacy Network">SPN <i class="icon-info text-sm"></i></span>. Or never exit in specific countries. And so much more...
</p>
</div>
</div>
<div class="showcase-one-container-reverse">
<div class="showcase-one-left" style="max-width: 550px;">
<img src="{{ site.img_url }}page-specific/spn/built-from-the-ground-up.png" alt="">
</div>
<div class="showcase-one-right">
<h2 class="showcase-one-right-title" style="max-width: 450px;" id="built-from-scratch">
Built from Scratch,<br> for Your Privacy
</h2>
<p class="showcase-one-right-desc">
<span tooltip="Safing Privacy Network">SPN <i class="icon-info text-sm mr-1"></i></span> is built from the ground up. Privacy is cooked right into it. Inspired by Tor, it comes with onion routing and state of the art encryption. Fully open source so all our claims can be validated.
</p>
<a class="btn-tertiary px-2" href="{{ site.github_url }}/spn"><i class="icon-github text-md mr-2"></i>Inspect source code</a>
</div>
</div>
<div class="showcase-two-container">
<div class="showcase-two-top-break-left">
<h2 class="showcase-two-top-title" style="max-width: 550px;">
SPN in Action
</h2>
<p class="showcase-two-top-desc">
Watch a short video showing how you easily get multiple identities per app, by default.
</p>
</div>
<div class="showcase-two-bottom" style="max-width: 850px;">
<div class="card" style="background-color: transparent;">
<div class="overflow-hidden">
<video preload="auto" src="https://assets.safing.io/spn/feature-tour.mp4" poster="https://assets.safing.io/spn/feature-tour-poster.png" controls="" style="object-fit: cover; border-radius: 12px;">
</video>
</div>
<img class="hidden lg:block" style="position: absolute; top: -35px; max-width: 80rem; left: -76px; z-index: -1;" src="{{ site.img_url }}page-specific/spn/spn-in-action.png" alt="">
</div>
</div>
<!-- <div class="showcase-bg"></div> -->
</div>
<div class="showcase-one-container">
<div class="showcase-one-left" style="max-width: 850px;">
<img src="{{ site.img_url }}page-specific/spn/bye-bye-vpns.png" alt="">
</div>
<div class="showcase-one-right">
<h2 class="showcase-one-right-title" style="max-width: 450px;" id="bye-bye-vpns">
Bye Bye, VPNs
</h2>
<p class="showcase-one-right-desc">
VPN technology was NOT built for user privacy, but for company security. Because of that, you can only trust a VPN provider's policy - and many have been caught abusing user data. Honestly, the best way forward: just stop paying for outdated technology.
</p>
<a class="btn-secondary" href="{{ site.vpn_comparison_url }}">
Compare SPN to VPNs
</a>
</div>
</div>
<div class="showcase-two-container">
<div class="showcase-two-top-break-left">
<h2 class="showcase-two-top-title" id="feature-comparison-chart" style="max-width: 550px;">
Feature Comparison
</h2>
</div>
{% include spn_vs_others.html %}
</div>
<div class="showcase-two-container">
<div class="showcase-two-top-break-left">
<h2 class="showcase-two-top-title" id="feature-comparison-chart" style="max-width: 550px;">
Upgrade Your Privacy
</h2>
<p class="showcase-two-top-desc">
Everything is built from scratch and designed to truly protect you from mass surveillance.
</p>
</div>
<div class="element-x-center max-w-sm md:max-w-7xl">
<div class="package-billing darkmode">
<div class="package-billing-top">
<div class="package-billing-top-line-left" style="margin-right: 20px;"></div>
<div class="package-billingtop-top-center">
<div class="package-billingtop-top-center-inner">
<span>Per Month</span>
<span>Per Year</span>
</div>
</div>
<div class="package-billing-top-line-right" style="margin-left: 20px;"></div>
</div>
<input class="package-billing-toggle darkmode" type="checkbox" id="consent_text" name="consent_text" value="yes">
<div class="package-billing-bottom">
<div class="content-one">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 transform scale-90 xl:scale-100 gap-5 lg:gap-28 xl:gap-0 justify-center justify-items-center mx-auto" style="align-items: center;">
{% include pricing_card_free.html unique_id="1" %}
{% include pricing_card_supporter.html price="4" interval="Month (billed annually)" plan_id="9" %}
{% include pricing_card_unlimited.html price="9.90" interval="Month" plan_id="1" %}
</div>
</div>
<div class="content-two">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 transform scale-90 xl:scale-100 gap-5 lg:gap-28 xl:gap-0 justify-center justify-items-center mx-auto" style="align-items: center;">
{% include pricing_card_free.html unique_id="2" %}
{% include pricing_card_supporter.html price="40" interval="Year" plan_id="10" %}
{% include pricing_card_unlimited.html price="99" interval="Year" plan_id="2" %}
</div>
</div>
</div>
</div>
<div class="flex mx-auto w-max mt-8 space-x-8 items-center opacity-50" style="position: relative; z-index: -1;">
<div class="space-x-8 hidden lg:flex items-center">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/mastercard.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/visacard.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/amex.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/paypal.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/cash.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/monero.png">
<img src="{{ site.img_url }}page-specific/pricing/payment-methods/bitcoin.png">
</div>
</div>
</div>
</div>
<div class="faq-container mb-60" id="faq">
<div class="faq-container-top">
<h2 class="faq-container-top-title">
FAQ
</h2>
<p class="faq-container-top-desc">
You have more questions? <a class="link-primary" href="{{ site.discord_url }}">Join our Discord community!</a>
</p>
</div>
<div class="faq-container-bottom">
{% for faq in site.data.faq.spn %}
<div class="faq-container-bottom-question">
<div class="card-faq darkmode hover-scale-out">
<label class="card-label" for="card-toggle-anchor-{{ forloop.index }}">
<div class="wrapper-left">
<div class="card-title">
<h3 class="title">
{{ faq.q }}
</h3>
</div>
</div>
<div class="wrapper-right">
<i class="icon-arrow"></i>
</div>
</label>
<input class="card-input-toggle" id="card-toggle-anchor-{{ forloop.index }}" type="checkbox">
<div class="card-dropdown-toggle">
<div class="card-dropdown-content">
{{ faq.a }}
{% if faq.link %}
<br>
<br>
<a class="link-primary" href="{{ faq.link.url }}">{{ faq.link.text }}</a>
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
{% include source_code_faq.html %}
</div>
</div>
<div class="showcase-two-container">
<div class="showcase-two-top-left" style="max-width: 73rem;">
<h2 class="showcase-two-top-title" style="max-width: 550px;">
SPN News
</h2>
<p class="showcase-two-top-desc" style="max-width: 430px;">
Read everything about the latest updates regarding Portmaster, SPN and Safing.
</p>
</div>
<div class="showcase-two-bottom" style="max-width: 100%;">
<div class="blogpod-container" style="margin-top: 0;">
<div class="blogpod-container-bottom">
{% assign all_publications = site.publications | where_exp:"item",
"item.hide_from_features != true" | sort: "date" | reverse %}
{% for publication in all_publications limit: 3 %}
{% if publication.category == "blog" %}
{% assign post = publication %}
{% include thumbnail_blog.html pre_header="BLOG" %}
{% endif %}
{% endfor %}
</div>
</div>
</div>
</div>
</section>