Poner botón de acción
Llamá la atención del usuario sobre un hipervínculo para que concrete una acción, como descargar un archivo, inscribirse en un curso, iniciar un trámite o ir a un contenido específico.
En esta página
- Descargar archivos o ver más información dentro del sitio: .btn-primary (azul)
- Hacer un procedimiento en línea o ir a un sitio fuera de argentina.gob.ar: .btn-success (verde)
- Vincular una información secundaria con menos énfasis: .btn-link (gris)
- Hacer algo urgente o irreversible: .btn-danger (rojo)
Si aún no lo hiciste, primero leé atentamente la sección en la que explicamos qué son los botones, para qué sirve cada tipo y los estándares de uso.
Descargar archivos o ver más información dentro del sitio: .btn-primary
Para insertar un botón btn-primary, copiá el siguiente código, editalo y pegalo entre dos párrafos con una línea libre arriba y abajo.
[Texto del botón, comienza con verbo](url-destino){.btn.btn-primary.btn-tamaño}
Por ejemplo, el siguiente código de botón de tamaño normal
[Conocé más](https://www.argentina.gob.ar){.btn.btn-primary}
se vería así.
Si quisiéramos que fuera pequeño, el código sería
[Conocé más](https://www.argentina.gob.ar){.btn.btn-primary.btn-sm}
y se vería así.
Si lo quisiéramos grande, en cambio, el código sería
[Conocé más](https://www.argentina.gob.ar){.btn.btn-primary.btn-lg}
y se vería así.
Hacer un procedimiento en línea o ir a un sitio fuera de argentina.gob.ar: .btn-success
Para insertar un botón btn-success, copiá el siguiente código, editalo y pegalo entre dos párrafos con una línea libre arriba y abajo.
[Texto del botón, comienza con verbo](url-destino){.btn.btn-success.btn-tamaño}
Por ejemplo, el siguiente código de botón de tamaño normal
[Sacá turno](https://www.argentina.gob.ar/turnos){.btn.btn-success}
se vería así.
Si quisiéramos que fuera pequeño, el código sería
[Sacá turno](https://www.argentina.gob.ar/turnos){.btn.btn-success.btn-sm}
y se vería así.
Si lo quisiéramos grande, en cambio, el código sería
[Sacá turno](https://www.argentina.gob.ar/turnos){.btn.btn-success.btn-lg}
y se vería así.
Vincular una información secundaria con menos énfasis: .btn-link
Para insertar un botón btn-link, copiá el siguiente código, editalo y pegalo entre dos párrafos con una línea libre arriba y abajo.
[Texto del botón, comienza con verbo](url-destino){.btn.btn-success.btn-tamaño}
Por ejemplo, el siguiente código de botón de tamaño normal
[C3 - Centro Cultural de la Ciencia](blank:#https://c3.jefatura.gob.ar/){.btn.btn-link}
se vería así.
C3 - Centro Cultural de la Ciencia
Si quisiéramos que fuera pequeño, el código sería
[C3 - Centro Cultural de la Ciencia](blank:#https://c3.jefatura.gob.ar/){.btn.btn-link.btn-sm}
y se vería así.
C3 - Centro Cultural de la Ciencia
Si lo quisiéramos grande, en cambio, el código sería
[C3 - Centro Cultural de la Ciencia](blank:#https://c3.jefatura.gob.ar/){.btn.btn-link.btn-lg}
y se vería así.
C3 - Centro Cultural de la Ciencia
Hacer algo urgente o irreversible: .btn-danger
Para insertar un botón btn-danger, copiá el siguiente código, editalo y pegalo entre dos párrafos con una línea libre arriba y abajo.
[Texto del botón, comienza con verbo](url-destino){.btn.btn-success.btn-tamaño}
Por ejemplo, el siguiente código de botón de tamaño normal
[Cancelá tu turno](https://www.argentina.gob.ar/turnos){.btn.btn-danger}
se vería así.
Si quisiéramos que fuera pequeño, el código sería
[Cancelá tu turno](https://www.argentina.gob.ar/turnos){.btn.btn-danger.btn-sm}
y se vería así.
Si lo quisiéramos grande, en cambio, el código sería
[Cancelá tu turno](https://www.argentina.gob.ar/turnos){.btn.btn-danger.btn-lg}
y se vería así.