Title of this post had a star or a border with brand colors. Why? Because it is featured. Also it has no related posts! Because it is different from others and have no family… Or its commented out in the code!

See the frontmatter of it at content/posts/typography.md file, don’t judge! By the way this post being the first one in the blog have something to do with it is publishDate. It’s the latest.

With the expressive code plugin as you can see below, you can color the lines with hightlight, delete or insert and collapse any number of lines. Also copy code buttons added to them all.

1
---
2
isFeatured: true
3
title: Typography examples, most of it!
4
description: See most of the markdown examples here. Copy elsewhere and use, if you ever get stuck.
5
tags: [ai, business, future]
2 collapsed lines
6
cover: "./navigating-the-future-the-role-of-ai-in-modern-business.jpg"
7
coverAlt: "A futuristic illustration of AI integrating with business"
8
publishDate: 2024-10-30
9
# relatedPosts: ['the-day-my-code-went-rogue-a-tale-of-ai-shenanigans', 'embracing-change-the-future-of-remote-work']
10
---

This is h1 title

h1 is used up above at the start of the page as THE title. So you should start with h2 titles like this;

1
## Your h2 title

Also using h1 in the markdown content has no effect for the page. But for the accessibility and SEO reasons, use them in order. Order in this page is wrong, it is for demonstration purposes only!

Message Blocks

This is h2 title

This is h3 title

This is h4 title

This is h5 title

This is h6 title above a divider

And A Table

Table is styled as others in the file Prose.astro, look at the code block below. You can easily figure it out by changing the styles with prose-thead, prose-th, prose-td, prose-tr classes.

1
<div
2 collapsed lines
2
  class="prose prose-headings:text-neutral-200 prose-h2:mb-3 prose-h2:text-2xl prose-h3:mb-2 prose-h4:mb-1 prose-p:text-neutral-400 prose-a:scroll-m-20 prose-a:text-brand-500 prose-a:no-underline prose-a:transition-colors prose-a:duration-300 hover:prose-a:text-brand-600 prose-blockquote:border-l-2 prose-blockquote:border-l-brand-500 prose-blockquote:font-light prose-strong:text-neutral-300 prose-li:scroll-m-20 prose-headings:scroll-m-24 prose-li:marker:text-neutral-400 ..."
3
>
4
  ...
5
</div>

I’m a cat dog person! Examples of strikethrough, bold and italic text.

Here is a link which goes to google in a blank page, because its external link. Here is another link which goes to blog page in same window, because its internal link.

Oh, look an illusive footnote! => ¹

What about ordered lists? Numbered you ask?

Lists, within lists. Look at the indent!

1. Data Analysis and Insights

   • AI can process vast amounts of data quickly, providing businesses with valuable insights that inform strategic decisions.
   • Companies like Netflix and Amazon utilize AI algorithms to analyze viewer preferences and purchasing behavior, tailoring recommendations that increase user engagement and sales
     • I’m inside another list!
       • This can go on forever…
         • And ever…
           • and eve..

2. Automation of Routine Tasks

   • Many organizations are leveraging AI to automate repetitive tasks, freeing up employees to focus on higher-value work.
   • From chatbots handling customer inquiries to robotic process automation in finance, AI is streamlining operations across industries.

3. Enhanced Customer Experience

   • AI-driven tools, such as personalized marketing platforms and virtual assistants, enable businesses to provide tailored experiences to their customers.
   • A report by McKinsey indicates that companies implementing AI-driven personalization can see revenue increases of up to 10% or more.

Or without numbers, unordered I mean?

While the benefits of AI are clear, organizations must navigate several challenges:

• Data Privacy Concerns: With increased data collection comes heightened scrutiny over privacy practices. Businesses must ensure they comply with regulations like GDPR to maintain consumer trust.

• Job Displacement: The rise of AI may lead to job displacement in certain sectors. It’s crucial for businesses to invest in reskilling their workforce to adapt to the changing landscape.

• Ethical Considerations: As AI systems become more autonomous, ethical considerations regarding their use and decision-making processes become paramount. Organizations must establish clear guidelines to govern AI applications.

And an image

What a beautiful day!

1
<p>
4 collapsed lines
2
  <span class="text-red text-2xl font-bold">Also</span>{" "}
3
  <span class="text-green text-sm font-light">don't forget</span> that{" "}
4
  <span class="text-3xl uppercase">you can</span> just use html with tailwindcss
5
  here. And style as you wish. Good luck!
6
</p>
7

8
<div class="rounded-lg p-3 text-neutral-400">Beware, angry footnote below!</div>

Also don’t forget that you can just use html with tailwindcss here. And style as you wish. Good luck!