Tipografía
Título 1

h1 / Título Principal

Título 2

h2 / Subtítulo 1

Título 3

h3 / Subtítulo 2

Título 4

h4 / Subtítulo 3

Título 5
h5 / Subtítulo 4
Párrafo

p / Párrafo lorem ipsum dolor, sit, amet consectetur adipisicing elit. Libero provident maxime veritatis possimus porro eligendi perspiciatis magni, iure nulla vero reprehenderit neque tenetur. Unde, maxime, minima tempore incidunt rerum amet.

Etiqueta
Enlaces
Enlace Normal
a / Enlace
Botón Primary
Btn Primary
Btn Primary Disabled
Btn Primary Outline
Dropdown linkDropdown link
Botón Secundary
Btn Secondary
Btn Secondary Disabled
Btn Secondary Outline
Botón Success
Btn Success
Btn Success Disabled
Btn Success Outline
Dropdown linkDropdown link
Botón Default
Btn Default
Btn Default Disabled
Btn Default Outline
Botón Link
Btn Link
Btn Link Disabled
Btn Link Outline
Botón Info
Btn Info
Btn Info Disabled
Btn Info Outline
Dropdown linkDropdown link
Botón Warning
Btn Warning
Btn Warning Disabled
Btn Warning Outline
Botón Danger
Btn Danger
Btn Danger Disabled
Btn Danger Outline
Dropdown linkDropdown link
Botón Light
Btn Light
Btn Light Disabled
Btn Light Outline
Botón Dark
Btn Dark
Btn Dark Disabled
Btn Dark Outline
Tamaños Botones
Btn lg
Btn lg disabled
Btn sm
Btn sm disabled
Btn xs
Btn xs disabled
Botones Checkbox
Botones Radio
Botones Group
Horizontal
Vertical
Botones Spinner
Botones anidados y Dropdown
Dropdown LinkDropdown Link
Dropdown LinkDropdown Link
Dropdown LinkDropdown Link
Dropdown LinkDropdown Link
Formularios
Formulario Apilado

Example Custom file input

Formulario por filas/cuadriculas
Formulario Validación
Valid.
Please fill out this field.
Valid.
Please fill out this field.
Tarjetas
Tarjeta Básica
Basic card
Tarjeta con Header y Footer
Header
Content
Footer
Tarjeta con título, texto y enlaces

Card title

Some example text. Some example text.

Card linkAnother link
Tarjeta con imagen
Card image

Vennex Group

Some example text.

See Profile

VennexGroup

Some example text.

See Profile
Card image
Tarjeta con enlace total
Card image

Vennex Group

Some example text.

See Profile

VennexGroup

Some example text.

See Profile
Card image
Tarjeta con superposición de imagen
Card image

Vennex Group

Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia.

See Profile
Columna de Tarjetas

Some text inside the first card

Some text inside the second card

Some text inside the third card

Some text inside the fourth card

Some text inside the fifth card

Some text inside the sixth card

Baraja de Tarjetas

Some text inside the first card Some text inside the first card Some text inside the first card Some text inside the first card Some text inside the first card Some text inside the first card Some text inside the first card

Some text inside the second card

Some text inside the third card

Some text inside the fourth card

Grupo de Tarjetas

Some text inside the first card Some text inside the first card Some text inside the first card Some text inside the first card

Some text inside the second card

Some text inside the third card

Some text inside the fourth card

Pleglables
Pleglable Básico
Lorem ipsum dolor text....
Accordeon
Accordeon con solo 1 elemento abierto
Navs
Menú
Pestañas

HOME

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Píldoras

HOME

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Barra de navegación
Barra de navegación contraída
Paginación
Paginación Básica
Estado activo
Estado inactivo
Migas de pan
Alertas
Alertas Básicas
Info! This alert box could indicate a neutral informative change or action.
Warning! This alert box could indicate a warning that might need attention.
Danger! This alert box could indicate a dangerous or potentially negative action.
Primary! Indicates an important action.
Secondary! Indicates a slightly less important action.
Dark! Dark grey alert.
Light! Light grey alert.
Alertas con enlace
Success! You should read this message.
Info! You should read this message.
Warning! You should read this message.
Danger! You should read this message.
Primary! You should read this message.
Secondary! You should read this message.
Dark! You should read this message.
Light! You should read this message.
Alertas con cierre
Success! This alert box could indicate a successful or positive action.
Info! This alert box could indicate a neutral informative change or action.
Warning! This alert box could indicate a warning that might need attention.
Danger! This alert box could indicate a dangerous or potentially negative action.
Primary! Indicates an important action.
Secondary! Indicates a slightly less important action.
Dark! Dark grey alert.
Light! Light grey alert.
Alerta animada
Danger! This alert box could indicate a dangerous or potentially negative action.
Tablas
Tabla Básica
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla Negra
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla con filas de rayas
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla con filas flotantes
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla con bordes
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla sin bordes
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla con clases contextuales
FirstnameLastnameEmail
DefaultDefaultsondef@somemail.com
PrimaryJoejoe@example.com
SuccessDoejohn@example.com
DangerMoemary@example.com
InfoDooleyjuly@example.com
WarningRefsbo@example.com
ActiveActivesonact@example.com
SecondarySecondsonsec@example.com
LightAngieangie@example.com
DarkBobo@example.com
Colores del cabezote de la tabla
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
FirstnameLastnameEmail
JohnDoejohn@example.com
MaryMoemary@example.com
JulyDooleyjuly@example.com
Tabla responsive
#FirstnameLastnameAgeCityCountrySexExampleExampleExampleExampleExampleExampleExampleExampleExampleExampleExampleExample
1AnnaPitt35New YorkUSAFemaleYesYesYesYesYesYesYesYesYesYesYesYes
Barras de progreso
Barra de progreso básica
Barra de progreso con etiqueta
70%
Barra de progreso a rayas
Barra de progreso animada
Barras de progreso apiladas
Free Space
Warning
Danger
Insignias
Insignia Básica
PrimarySecondarySuccessDangerWarningInfoLightDark
Insignia dentro de un elemento
Carrusel
Carrusel Básico
Carrusel con subtítulos
Modal
Modal con desplazamiento
Modal con scroll