📖 Step 3: Design - UI Components & Patterns#77 / 291
Anchor Link
Anchor Link
📖One-line summary
A link that scrolls to a specific section on the same page.
✨Example
Anchor links that jump to a spot on the page
#About
About section content.
#Feature
Feature section content.
#Pricing
Pricing section content.
#Contact
Contact section content.
⚡Vibe coding prompt examples
>_
Build anchor link navigation for a long doc page. Show a table of contents on the side and smooth-scroll to the section on click.
>_
Build a feature where the anchor link of the currently viewed section auto-highlights based on scroll position. Use Intersection Observer.
>_
Update the URL hash when an anchor link is clicked. Implement it so reloading the page navigates to that section.
Try these prompts in your AI coding assistant!