index.html

---
title: Chat Freely with Matrix.
description: Imagine a place... where you are welcomed to be yourself, where you have control on your data, and where you can talk more privately, while also allowing you to socialize with others. Join Matrix, the federated chat platform that actually respects you.
layout: default
---
<div class="jumbotron bg-gray-light">
  <div class="container-lg px-4 pb-md-4">
    <div class="col-sm-10 col-md-7 float-md-left mb-3 mb-md-0">
      <h1 class="display-alpha mb-3">Chat Freely<br>with Matrix</h1>
      <p class="heading-gamma dim mb-4">
        Imagine a place... where you are welcomed to be yourself, where you have control on your data, and where you can talk more privately, while also allowing you to socialize with others.
      </p>
      <p class="mb-4 mb-md-0 f3 text-serif">
        <a href="{{ "/guide/" | absolute_url }}" class="btn btn-blue mr-1 btn-raise-hover">Tell me more!</a>
        <a href="{{ "/guide/#get-started" | absolute_url }}" class="btn btn-raise-hover">How can I join?</a>
      </p>
    </div>
    <div class="col-md-4 float-md-right">
      <div class="card card-with-stripe mt-3 box-shadow-none">
        <h2 class="heading-gamma mb-2">Get started in minutes:</h2>
        <ol class="ol-styled ml-4">
          <li><a href="{{ "/servers" | absolute_url }}" class="text-underline">Pick a homeserver</a> to use Matrix with</li>
          <li><a href="{{ "/guide/#get-started" | absolute_url }}" class="text-underline">Register an account</a></li>
          <li><a href="{{ "/guide/#what-rooms-can-i-join" | absolute_url }}" class="text-underline">Join some rooms</a> to start your exploration</li>
          <li>Have fun chatting!</li>
        </ol>
      </div>
    </div>
  </div>
</div>
<div class="page-section py-md-0">
  <div class="container-lg px-4">
    <div class="clearfix">
      <div class="col-md-4 float-left home-side-image-wrapper">
        <img src="{{ "assets/images/demo.png" | absolute_url }}" alt="Abstract screenshot of Element" class="home-side-image" width="843" height="527">
      </div>
      <div class="col-md-8 float-right mt-md-4 pt-6">
        <h2 class="heading-beta">Yet another chat platform?</h2>
        <p class="text-intro text-sans text-normal mb-4">I get it, you would say that because you're annoyed by <a href="{{ "/guide/matrix-vs-discord" | absolute_url }}">Discord</a>, skeptical of <a href="{{ "/guide/matrix-vs-telegram" | absolute_url }}">Telegram</a>, angered by Facebook, tired of Slack, frustrated by XMPP, and bored of IRC. No need to go back to the good ol' email: There is a greener pasture waiting for you, and - you guessed it right - it's Matrix!</p>
        <ul class="list-checklist d-flex flex-wrap flex-justify-between flex-items-stretch">
          <li class="col-sm-5">End-to-end encryption to protect your private messages!</li>
          <li class="col-sm-5">Retain control of your data, without compromising access to the Matrix federation - Run your own server, or join an existing server!</li>
          <li class="col-sm-5">Got friends who just won't come over? <a href="{{ "/guide/features/#all-about-bridges" | absolute_url }}">Bridges</a> to existing platforms allow you to stay in touch with them!</li>
          <li class="col-sm-5">Open source software means you can audit, customize, and improve Matrix yourself!</li>
          <li class="col-sm-5">Matrix is not <a href="{{ "/guide/matrix-vs-al/#centralized-platforms" | absolute_url }}">centralized</a>: No need to rely on the big tech for your basic needs!</li>
          <li class="col-sm-5">A platform of the people, by the people, for the people!</li>
        </ul>
        <p class="border-top pt-2 mt-4"><a href="{{ "/guide/" | absolute_url }}" class="no-underline">Learn more about Matrix <svg class="svg-icon ml-2" width="14" height="14"><use xlink:href="{{ "/assets/images/icons/open-iconic/sprite.min.svg#arrow-right" | absolute_url }}"></use></svg></a></p>
      </div>
    </div>
  </div>
</div>
<!--
<div class="page-section bg-royal-blue overflow-hidden">
  <div class="container-lg px-4">
    <div class="col-md-5 float-right pl-4">
      <h2 class="heading-gamma mb-2 text-white dim">Quick start into Matrix</h2>
      <p class="text-white mb-3">
        It's time to ditch whatever social-chatting platform you're using.
      </p>
    </div>
    <div class="col-md-7 float-left d-flex flex-wrap">
      <div class="col-md-6 px-2 pb-3">
        <div class="card">From Discord</div>
      </div>
      <div class="col-md-6 px-2 pb-3">
        <div class="card">From Telegram</div>

      </div>
      <div class="col-md-6 px-2 pb-3">
        <div class="card">For communities</div>

      </div>
      <div class="col-md-6 px-2 pb-3">
        <div class="card">For businesses</div>

      </div>
    </div>
  </div>
-->
</div>