Icons

Icons

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Link with Icon

Componente de enlace con íconos a ambos lados del texto, diseñado para destacar acciones o redirecciones en una interfaz. Su estilo subrayado y moderno facilita la interacción y llama la atención sobre las opciones disponibles. Ideal para botones o enlaces de navegación en aplicaciones web.

				
					<div class="state-default-color-black-type-link-style-header">
  <img loading="lazy" src="https://cdn.builder.io/api/v1/image/assets/0c005118f90b4287b8913383c1a91836/cddae90fb73f445eefc47271ee806d1270db5010fe6af8c9d1b6a06a096ccf48?apiKey=0c005118f90b4287b8913383c1a91836&#038;" class="img" /></p>
<div class="text">Type something</div>
<p>  <img loading="lazy" src="https://cdn.builder.io/api/v1/image/assets/0c005118f90b4287b8913383c1a91836/257839d608cfe64b84be8d95e4eff066718cc26b7b6d826f9cc1d4b27ccea2c0?apiKey=0c005118f90b4287b8913383c1a91836&#038;" class="img" />
</div>
<style>
  .state-default-color-black-type-link-style-header {
    display: flex;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    color: var(--Pink-pink-500, #ce0875);
    text-decoration: underline;
    justify-content: start;
    font: 700 18px Bankinter Text, sans-serif;
  }
  .img {
    aspect-ratio: 1;
    object-fit: contain;
    object-position: center;
    width: 24px;
    align-self: stretch;
    margin: auto 0;
  }
  .text {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    align-self: stretch;
    margin: auto 0;
  }
</style>

				
			
				
					<div class="state-default-color-black-type-link-style-header">
  <img loading="lazy" src="https://cdn.builder.io/api/v1/image/assets/0c005118f90b4287b8913383c1a91836/cddae90fb73f445eefc47271ee806d1270db5010fe6af8c9d1b6a06a096ccf48?apiKey=0c005118f90b4287b8913383c1a91836&#038;" class="img" /></p>
<div class="text">Type something</div>
<p>  <img loading="lazy" src="https://cdn.builder.io/api/v1/image/assets/0c005118f90b4287b8913383c1a91836/257839d608cfe64b84be8d95e4eff066718cc26b7b6d826f9cc1d4b27ccea2c0?apiKey=0c005118f90b4287b8913383c1a91836&#038;" class="img" />
</div>
<style>
  .state-default-color-black-type-link-style-header {
    display: flex;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    color: var(--Pink-pink-500, #ce0875);
    text-decoration: underline;
    justify-content: start;
    font: 700 18px Bankinter Text, sans-serif;
  }
  .img {
    aspect-ratio: 1;
    object-fit: contain;
    object-position: center;
    width: 24px;
    align-self: stretch;
    margin: auto 0;
  }
  .text {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    align-self: stretch;
    margin: auto 0;
  }
</style>