DEV Community

CodeWithCaen
CodeWithCaen

Posted on • Originally published at tips.desilva.se

Quick Tip: How To Use Blue Links in Tailwind Typography (Prose)

#beginners #tutorial #tailwindcss

The Tailwind Typography plugin (that adds the .prose class) comes with a very opinionated link style. If you want the more classic one, it's easy to fix in the config. You can also go bold and use any other color of course. I'm going with Indigo for a sweet blue link.

theme: {
    extend: {
        fontFamily: {
            sans: ['Inter var', ...defaultTheme.fontFamily.sans],
        },
        typography: (theme) => ({
            DEFAULT: {
                css: {
                    a: {
                        color: theme('colors.indigo.600'),
                        textDecoration: 'none',
                        '&:hover': {
                            color: theme('colors.indigo.500'),
                        },
                    },
                },
            },
        }),
    },
},
Enter fullscreen mode Exit fullscreen mode

And that's it!

Top comments (0)

Read next

koolkamalkishor profile image

Evaluating Medical Retrieval-Augmented Generation (RAG) with NVIDIA AI Endpoints and Ragas

KAMAL KISHOR -

mikeyoung44 profile image

LLM Quantization: Balancing Accuracy and Efficiency for Real-World Deployments

Mike Young -

mikeyoung44 profile image

EmbodiedRAG: Dynamic Scene Graphs for Efficient Robot Task Planning in Real-World Environments

Mike Young -

mikeyoung44 profile image

Logits of API-Protected LLMs Reveal Proprietary Model Details, Researchers Find

Mike Young -