Destinos

# Destinos

Los destinos (o canales) son las plataformas donde AlertHub entrega tus notificaciones.

<div class="search-container">
    <input type="text" id="destSearch" placeholder="Buscar destinos...">
</div>

<div class="integration-grid" id="destGrid">
    <a href="/es/docs/integrations/destinations/discord/" class="integration-card" data-name="discord">
        <div class="icon"><i class="fa-brands fa-discord" aria-hidden="true"></i></div>
        <h4>Discord</h4>
        <p>Webhooks del servidor</p>
    </a>
    <a href="/es/docs/integrations/destinations/email/" class="integration-card" data-name="email">
        <div class="icon"><i class="fa-solid fa-envelope" aria-hidden="true"></i></div>
        <h4>Email</h4>
        <p>Directo a tu bandeja</p>
    </a>
    <a href="/es/docs/integrations/destinations/google-chat/" class="integration-card" data-name="google chat gchat">
        <div class="icon"><i class="fa-brands fa-google-chat" aria-hidden="true"></i></div>
        <h4>Google Chat</h4>
        <p>Incoming webhooks</p>
    </a>
    <a href="/es/docs/integrations/destinations/gotify/" class="integration-card" data-name="gotify">
        <div class="icon"><i class="fa-solid fa-gotify" aria-hidden="true"></i></div>
        <h4>Gotify</h4>
        <p>Push self-hosted</p>
    </a>
    <a href="/es/docs/integrations/destinations/mattermost/" class="integration-card" data-name="mattermost">
        <div class="icon"><i class="fa-brands fa-mattermost" aria-hidden="true"></i></div>
        <h4>Mattermost</h4>
        <p>Incoming webhooks</p>
    </a>
    <a href="/es/docs/integrations/destinations/microsoft-teams/" class="integration-card" data-name="microsoft teams">
        <div class="icon"><i class="fa-brands fa-microsoft" aria-hidden="true"></i></div>
        <h4>Teams</h4>
        <p>Adaptive cards</p>
    </a>
    <a href="/es/docs/integrations/destinations/ntfy/" class="integration-card" data-name="ntfy ntfy.sh">
        <div class="icon"><i class="fa-solid fa-bell" aria-hidden="true"></i></div>
        <h4>ntfy</h4>
        <p>Push por topic</p>
    </a>
    <a href="/es/docs/integrations/destinations/slack/" class="integration-card" data-name="slack">
        <div class="icon"><i class="fa-brands fa-slack" aria-hidden="true"></i></div>
        <h4>Slack</h4>
        <p>Mensajes en canal</p>
    </a>
    <a href="/es/docs/integrations/destinations/telegram/" class="integration-card" data-name="telegram">
        <div class="icon"><i class="fa-brands fa-telegram" aria-hidden="true"></i></div>
        <h4>Telegram</h4>
        <p>Notificaciones por bot</p>
    </a>
    <a href="/es/docs/integrations/destinations/whatsapp/" class="integration-card" data-name="whatsapp">
        <div class="icon"><i class="fa-brands fa-whatsapp" aria-hidden="true"></i></div>
        <h4>WhatsApp</h4>
        <p>Solo planes de pago</p>
    </a>
</div>

<style>
.search-container {
    margin-bottom: 2rem;
}
.search-container input {
    width: 100%;
    padding: 0.8rem 1.2rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: #1e293b;
    color: white;
    font-size: 1rem;
}
.search-container input:focus {
    outline: none;
    border-color: var(--color-primary);
}
.integration-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1.5rem;
}
.integration-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: #1e293b;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    text-decoration: none !important;
    transition: all 0.2s ease;
    text-align: center;
}
.integration-card:hover {
    transform: translateY(-5px);
    border-color: var(--color-primary);
    background: #252f45;
}
.integration-card .icon {
    font-size: 2.4rem;
    margin-bottom: 1rem;
    color: var(--color-primary);
    line-height: 1;
}
.integration-card h4 {
    margin: 0 !important;
    color: white;
    font-size: 1.2rem;
}
.integration-card p {
    margin: 0.5rem 0 0 0 !important;
    font-size: 0.8rem;
    color: #94a3b8;
}
</style>
Los destinos (o canales) son las plataformas donde AlertHub entrega tus notificaciones.