Access cues for sign in and protected actions

A lock or key can make an access step easier to recognise. Use these symbols beside a sign in form or a permission message.

Keep the actual permission state in text. A moving lock is a visual cue and does not secure a page or prove that information is protected.

Check the file size on each detail page and measure your export after editing. Load previews only when needed, respect reduced motion and keep status messages in real text.

We read the colours and fonts from your home page. They stay in this browser.

Questions

Does a shield animation show that a page is secure?

No. It is a visual asset. Only use it with an accurate message about your product, and keep access checks in the application itself.

How do I choose a file size and support reduced motion?

Check the file details before downloading and measure the exported file after editing. Compare Lottie JSON and dotLottie in a player that supports them. Load the animation near the screen and show a still frame when someone asks for reduced motion. Keep any status or instructions in real text.