Cómo configurar fuentes en PDF

Una fuente web es una fuente especializada diseñada para su uso en sitios web. Estas fuentes se alojan en servidores web y son descargadas por los navegadores para garantizar una representación coherente y visualmente atractiva del texto en los sitios web, independientemente de la disponibilidad local de fuentes del usuario. Además, las fuentes de iconos, que utilizan símbolos y glifos, se usan a menudo en diseño web para crear iconos escalables y personalizables y mantener una interfaz de usuario visualmente coherente mediante la manipulación de CSS.

CSS incluye fuentes web, lo que le permite especificar archivos de fuentes para descargar cuando se accede a su sitio web. IronPDF admite la carga de fuentes y el renderizado a PDF desde HTML.

Cómo configurar fuentes en PDF

Descargar biblioteca C# para definir fuentes en PDF
Utilizar HTML para importar o solicitar fuentes de una fuente externa
Retrasar el proceso de renderizado para garantizar la carga correcta de las fuentes.
Convierta el HTML en PDF como de costumbre
Utilice la regla @font-face en el estilo CSS para importar el archivo de fuentes

o

Ejemplo de uso de WebFonts e iconos

IronPDF es compatible con WebFonts (como Google Fonts y la API de fuentes web de Adobe) y fuentes de iconos, como las utilizadas por Bootstrap y FontAwesome.

Las fuentes suelen requerir un retraso en la renderización para cargarse correctamente. Si una fuente no se carga correctamente, puede aparecer una página en blanco sin texto. Puede utilizar el método WaitFor.AllFontsLoaded para esperar la fuente asignándole un tiempo máximo de espera. El tiempo máximo de espera por defecto es de 500 ms.

He aquí un pequeño ejemplo de cómo utilizar un WebFont llamado Langosta en su proyecto.

:path=/static-assets/pdf/content-code-examples/how-to/webfonts-webicons-render-webfont.cs

using IronPdf;

//  HTML contiene webfont
var html = @"<link href=""https://fonts.googleapis.com/css?family=Lobster"" rel=""stylesheet"">
<p style=""font-family: 'Lobster', serif; font-size:30px;"" > Hello Google Fonts</p>";

ChromePdfRenderer renderer = new ChromePdfRenderer();

//  Esperar a que se cargue la fuente
renderer.RenderingOptions.WaitFor.AllFontsLoaded(2000);

//  Convertir HTML en PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);

//  Exportar el PDF
pdf.SaveAs("font-test.pdf");

Imports IronPdf

'  HTML contiene webfont
Private html = "<link href=""https://fonts.googleapis.com/css?family=Lobster"" rel=""stylesheet"">
<p style=""font-family: 'Lobster', serif; font-size:30px;"" > Hello Google Fonts</p>"

Private renderer As New ChromePdfRenderer()

'  Esperar a que se cargue la fuente
renderer.RenderingOptions.WaitFor.AllFontsLoaded(2000)

'  Convertir HTML en PDF
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)

'  Exportar el PDF
pdf.SaveAs("font-test.pdf")

VB C#

Explora más opciones WaitFor, como las de fuentes, JavaScript, elementos HTML y ralentí de red en 'Cómo Utilizar la Clase WaitFor para Retrasar el Renderizado de PDF en C#.'

Importar archivo de fuentes Ejemplo

Para utilizar un archivo de fuentes existente, aplique la función @font-face en el estilo CSS. También funciona cuando se utiliza una combinación de la regla @font-face y la incrustación de archivos woff codificados en base64. En el siguiente ejemplo, utilizaré Pixelify Sans Font.

:path=/static-assets/pdf/content-code-examples/how-to/webfonts-webicons-custom-font.cs

using IronPdf;

//  Importar fuente personalizada
string html = @"<!DOCTYPE html>
<html>
<head>
<style>
@font-face {font-family: 'Pixelify';
src: url('fonts\PixelifySans-VariableFont_wght.ttf');
}
p {
    font-family: 'Pixelify';
    font-size: 70px;
}
</style>
</head>
<body>
<p>Custom font</p>
</body>
</html>";

ChromePdfRenderer renderer = new ChromePdfRenderer();

//  Convertir HTML en PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);

//  Exportar el PDF
pdf.SaveAs("customFont.pdf");

Imports IronPdf

'  Importar fuente personalizada
Private html As String = "<!DOCTYPE html>
<html>
<head>
<style>
@font-face {font-family: 'Pixelify';
src: url('fonts\PixelifySans-VariableFont_wght.ttf');
}
p {
    font-family: 'Pixelify';
    font-size: 70px;
}
</style>
</head>
<body>
<p>Custom font</p>
</body>
</html>"

Private renderer As New ChromePdfRenderer()

'  Convertir HTML en PDF
Private pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)

'  Exportar el PDF
pdf.SaveAs("customFont.pdf")

Cómo configurar fuentes en PDF