CodePen

CodePen is a social development environment for front-end designers and developers, offering a browser-based playground for writing and sharing HTML, CSS, and JavaScript. The platform allows users to create "Pens" (interactive code snippets) and share them publicly or privately. CodePen provides developer-facing APIs including an Embed API for displaying Pens on external sites, a POST to Prefill API for programmatically opening the Pen editor with pre-populated code, Prefill Embeds for transforming existing code blocks into interactive sandboxes, and an oEmbed endpoint for standard embed discovery. The platform is widely used by educators, tutorial authors, and documentation teams who need live, interactive code examples embedded in external pages.

CodePen publishes 4 APIs on the APIs.io network. Tagged areas include Developer Tools, Front-End Development, Code Playground, Embeds, and Education.

The CodePen catalog on APIs.io includes 1 JSON-LD context.

CodePen’s developer surface includes documentation, engineering blog, pricing, and 8 more developer resources.

🌐 Visit website 📡 Source on GitHub

27.6/100 emerging ▬ flat Agent 3/100 human only Full breakdown ↓
scored 2026-07-28 · rubric v0.6

AccessFreemium

4 APIs

Developer ToolsFront-End DevelopmentCode PlaygroundEmbedsEducation

Kin Score

Kin Score How this is scored →
scored 2026-07-28 · rubric v0.6

Composite quality — 27.6/100 · emerging

Contract Quality 3.2 / 25

Developer Ergonomics 2.2 / 20

Commercial Clarity 10.0 / 20

Operational Transparency 4.8 / 13

Governance 0.0 / 12

Discoverability 7.4 / 10

Agent readiness — 3/100 · human only

Machine-Readable Contract 0 / 18

Agentic Access Contract 0 / 10

MCP Server 0 / 12

Machine-Readable Auth 0 / 10

Idempotency 0 / 9

Stable Error Semantics 0 / 8

Request/Response Examples 0 / 7

Rate-Limit Signaling 7 / 7

Typed Event Surface 0 / 6

Agent Skills 0 / 5

Well-Known Catalog 0 / 4

Consent & Bot Identity 0 / 3

A2A Agent Card 0 / 8

Dry-Run / Simulate Mode 0 / 4

Improve this rating by publishing the missing artifacts — every area above can be raised, and the full rubric is at apis.io/rating/. This rating is computed from github.com/api-evangelist/codepen: open an issue to ask a question, or submit a pull request to add artifacts. Want it done for you? Prioritized profiling — $2,500 →

APIs 4

Individual APIs this provider publishes, each with its own machine-readable definition.

Rate Limits 1

Documented rate limits and quota policies.

Codepen Rate Limits

3 limits

RATE LIMITS

FinOps 1

Cost, billing, and metering signals for API financial operations.

Documentation 1

Reference material describing how the API behaves

Documentation

Documentation

Build 1

SDKs, sample code, and the tooling you integrate with

GitHubOrganization

GitHubOrganization

Access & Security 1

Authentication, authorization, and security posture

DomainSecurity

DomainSecurity

Operate 1

Status, limits, changes, and where to get help

RateLimits

RateLimits

Commercial 3

Pricing, plans, and the legal terms of use

Pricing

Pricing

Plans

Plans

FinOps

FinOps

Company 3

The organization behind the API

Website

Website

LinkedIn

Blog

Blog

Other 1

Properties that don't map to a standard resource type

Source (apis.yml)

aid: codepen
name: CodePen
description: CodePen is a social development environment for front-end designers and developers, offering a browser-based
  playground for writing and sharing HTML, CSS, and JavaScript. The platform allows users to create "Pens" (interactive code
  snippets) and share them publicly or privately. CodePen provides developer-facing APIs including an Embed API for displaying
  Pens on external sites, a POST to Prefill API for programmatically opening the Pen editor with pre-populated code, Prefill
  Embeds for transforming existing code blocks into interactive sandboxes, and an oEmbed endpoint for standard embed discovery.
  The platform is widely used by educators, tutorial authors, and documentation teams who need live, interactive code examples
  embedded in external pages.
type: Index
accessModel:
  pricing: freemium
  onboarding: unknown
  trial: false
  try_now: false
  public: false
  label: Freemium
  confidence: medium
  source:
  - plans
  generated: '2026-07-22'
  method: derived
image: https://kinlane-images.s3.amazonaws.com/shared/apis-json/icons/codepen.png
tags:
- Developer Tools
- Front-End Development
- Code Playground
- Embeds
- Education
url: https://raw.githubusercontent.com/api-evangelist/codepen/refs/heads/main/apis.yml
created: '2026-06-12'
modified: '2026-06-12'
specificationVersion: '0.19'
apis:
- aid: codepen:oembed
  name: CodePen oEmbed API
  description: Standard oEmbed endpoint that returns a rich embed payload (iframe HTML, thumbnail URL, author metadata) for
    any public CodePen Pen URL. Supports JSON and JSONP response formats and an optional height parameter.
  humanURL: https://blog.codepen.io/documentation/oembed/
  baseURL: https://codepen.io/api/oembed
  tags:
  - oEmbed
  - Embeds
  - Front-End Development
  properties:
  - type: Documentation
    url: https://blog.codepen.io/documentation/oembed/
- aid: codepen:embed
  name: CodePen Embed API
  description: Client-side JavaScript API for rendering and lazy-loading embedded Pens on external web pages. Uses the global
    window.__CPEmbed() function with data-* attributes on a .codepen div to control height, theme, default tab, animations,
    and zoom level. A __CodePenIFrameAddedToPage callback is available for post-embed hooks.
  humanURL: https://blog.codepen.io/documentation/embedded-pens/
  baseURL: https://public.codepenassets.com/embed/index.js
  tags:
  - Embeds
  - JavaScript
  - Front-End Development
  properties:
  - type: Documentation
    url: https://blog.codepen.io/documentation/embedded-pens/
- aid: codepen:post-to-prefill
  name: CodePen POST to Prefill API
  description: HTTP POST endpoint that accepts JSON-encoded code and configuration and opens a new (unsaved) Pen in the CodePen
    editor pre-populated with that content. Supports HTML, CSS, and JS content fields, preprocessor choices, external resources,
    and editor layout. No authentication is required.
  humanURL: https://blog.codepen.io/documentation/prefill/
  baseURL: https://codepen.io/pen/define/
  tags:
  - Front-End Development
  - Developer Tools
  properties:
  - type: Documentation
    url: https://blog.codepen.io/documentation/prefill/
- aid: codepen:prefill-embeds
  name: CodePen Prefill Embeds API
  description: Declarative embed API that transforms existing code blocks on a web page into live, interactive CodePen sandboxes
    without requiring users to navigate away. Code is supplied via data-prefill JSON attributes and pre elements; the embed
    script at public.codepenassets.com renders an isolated iFrame. Supports HTML, CSS, and JavaScript preprocessors, external
    stylesheets and scripts, and optional editable mode.
  humanURL: https://blog.codepen.io/documentation/prefill-embeds/
  baseURL: https://public.codepenassets.com/embed/index.js
  tags:
  - Embeds
  - Front-End Development
  - JavaScript
  properties:
  - type: Documentation
    url: https://blog.codepen.io/documentation/prefill-embeds/
common:
- type: DomainSecurity
  url: security/codepen-domain-security.yml
- type: Website
  url: https://codepen.io
- type: Documentation
  url: https://blog.codepen.io/documentation/
- type: GitHubOrganization
  url: https://github.com/codepen
- type: LinkedIn
  url: https://www.linkedin.com/company/codepen
- type: Blog
  url: https://blog.codepen.io
- type: Pricing
  url: https://codepen.io/pricing
- type: X
  url: https://twitter.com/CodePen
- type: Plans
  url: plans/codepen-plans-pricing.yml
- type: RateLimits
  url: rate-limits/codepen-rate-limits.yml
- type: FinOps
  url: finops/codepen-finops.yml
maintainers:
- FN: Kin Lane
  email: kin@apievangelist.com

CodePen

Kin Score

APIs 4

CodePen oEmbed API

CodePen Embed API

CodePen POST to Prefill API

CodePen Prefill Embeds API

Pricing Plans 1

Codepen Plans Pricing

Rate Limits 1

Codepen Rate Limits

FinOps 1

Codepen Finops

Semantic Vocabularies 1

Codepen Context

Security Posture 1

Codepen Domain Security

Resources