I have a string like this on C# that is rendered in HTML using Blazor.

The problem is I want the string to look like this.

How could I do this?

.razor.cs

using Microsoft.AspNetCore.Components;

namespace UI.Pages;

public partial class Blob : ComponentBase
{
    [Parameter] public string Uri { get; set; } = default!;
    [Inject] public AzureBlobStorageBlobItemQuery BlobItemQuery { get; set; } = default!;

    public string BlobContent { get; set; } = "Loading...";

    protected async override Task OnInitializedAsync()
    {
        using var blobContentReader = new StreamReader(await BlobItemQuery.GetBlobContent(new Uri(Uri)));
        BlobContent = await blobContentReader.ReadToEndAsync();
    }
}

.razor

@page "/blob/{Uri}"
<h3>Blob</h3>

<p>
    @BlobContent
</p>