Skip to content
Computing Medium #oidc#oauth#id-token

OIDC ID Token vs Access Token

ID token says who the user is. Access token says what the app can do. Different audiences, different lifetimes.

A free, animated oidc id token vs access token you can read here or embed on any website, from Scrollchart.

OIDC ID Token vs Access Token

OIDC: ID Token vs Access TokenSame OIDC flow issues two JWTs with different audiences, lifetimes, and intended consumers

Two JWTs side by side. ID token: aud=client, claims about the user (sub, name, email). Access token: aud=resource server, scopes the client may use. Lifetimes, refresh patterns, and use mistakes (using ID token for API calls) called out.

Good for

  • OIDC integration guides for product engineering teams
  • Security blog posts explaining common auth token mistakes
  • OAuth 2.0 and OIDC course material for developers

Source & accuracy

This oidc id token vs access token is an editorial illustration built to represent the concept accurately. Where it shows figures, they are typical or representative values chosen to make the relationship clear, not a single underlying dataset. The diagram and its explainer are reviewed and maintained centrally, and updated over time as understanding improves.

Authentication vs Authorization: Two Tokens

OpenID Connect (OIDC) layers authentication (proving who you are) on top of OAuth 2.0's authorization model (proving what you can do). The ID token is a signed claim that the user is authenticated and optionally contains claims about them (name, email, roles). The access token is an opaque credential that grants the app permission to call specific APIs or resources.

The ID token is for the app itself: it proves identity to the login form. The access token is for backend services: it proves the app has permission to request user data or perform actions. They have different audiences, different lifetimes, and different purposes.

Lifetime and Trust

ID tokens are typically short-lived (15 minutes to 1 hour), because they contain identity claims that should be fresh. If a token is stolen, it expires quickly, limiting the window of compromise. Access tokens can have longer lifetimes (hours to days) because they are opaque and revokable on the backend, not tied to specific claims about the user.

A compromised access token allows an attacker to call APIs; a compromised ID token allows them to impersonate a user in the login context. The distinction lets systems design different rotation and revocation strategies: ID tokens are refreshed more frequently, access tokens are stored more securely (httpOnly cookies, in-memory storage).

Embed this diagram

Add this animated oidc id token vs access token to your own site. Copy one line of HTML, or use the embed builder for theme and sizing options.

Reference

What this is
A free, embeddable, animated oidc id token vs access token for any website.
Who uses it
Security blogs, Developer blogs.
How to embed
Copy one line of HTML. No signup. No watermark. Works in WordPress, Webflow, Ghost, Substack, plain HTML.
File size
iframe embed, ~80 KB gzipped (loads on demand, does not block your page paint).
License
Free forever. Editorial explainer text included; updated centrally over time.

Embed format options

Copy the universal HTML snippet, the WordPress shortcode, or an iframe fallback - see the WordPress plugin page for details. Any format keeps the same Core Web Vitals profile and the same explainer text.

Embed snippet
<div data-scrollchart="oidc-id-token" data-scrollchart-v="1"></div>
<script src="https://scrollchart.com/embed.js" async></script>

Frequently asked questions

Where can I get a free animated "OIDC ID Token vs Access Token" for my website?
Scrollchart provides "OIDC ID Token vs Access Token" as a free, embeddable animated diagram you can add to any website with one line of HTML. No signup is required and there is no watermark. The diagram and its explainer text are served from scrollchart.com, so the embed stays current without any maintenance on your end.
How do I embed a oidc id token vs access token in a developer or tech blog?
Copy the one-line snippet from the Scrollchart diagram page and paste it into your post HTML. It works in any static site generator, CMS, or hand-coded HTML page. The embed is a thin loader, not an iframe, so the content is fully in your DOM.