Nav With Availability Dot
A navbar with name, centred links, and a pulsing emerald dot beside an availability month label on the right.
A navbar with name, centred links, and a pulsing emerald dot beside an availability month label on the right.
The Portfolio Collection unlocks the source for every Portfolio block. All Access unlocks every Collection.
Already purchased? Log in
Nav with Availability Dot adds a live-status indicator to a standard portfolio navbar: the name Avery Stone on the left, Work, About, Services, and Contact centred, and a pulsing emerald dot with the label Available from August on the right. The dot uses an animate-ping ring so it reads as a live signal without any JavaScript state.
Links are one array; the indicator is a standalone flex row. The pulsing dot is the distinctive detail; it turns an ambient availability message into something a visitor notices on first scan without it being a banner or a popup.
Reach for this block when you are actively looking for work and want the status visible on every page without repeating a banner section. The installer swaps the month label and switches the dot colour to a muted tone when they are not available.
A natural flow around it on a Portfolio Pro page:
Before
After
One strong use is the actively-seeking-clients header. Other availability nav layouts:
Tip: pair the dot with a matching availability band lower on the page so a visitor who misses the nav still gets the full context.