Gathering detailed insights and metrics for @chakra-ui/image
Gathering detailed insights and metrics for @chakra-ui/image
Chakra UI is a component system for building SaaS products with speed ⚡️
Installations
npm install @chakra-ui/imageDeveloper Guide
BETA
Typescript
Yes
Module System
CommonJS, ESM
Node Version
18.16.1
NPM Version
9.5.1
Releases
3,516
@chakra-ui/cli@3.22.0
@chakra-ui/cli@3.22.0
Updated on Jul 07, 2025
@chakra-ui/panda-preset@3.22.0
@chakra-ui/panda-preset@3.22.0
Updated on Jul 07, 2025
@chakra-ui/react@3.22.0
@chakra-ui/react@3.22.0
Updated on Jul 07, 2025
@chakra-ui/charts@3.22.0
@chakra-ui/charts@3.22.0
Updated on Jul 07, 2025
@chakra-ui/panda-preset@3.21.1
@chakra-ui/panda-preset@3.21.1
Updated on Jun 28, 2025
@chakra-ui/charts@3.21.1
@chakra-ui/charts@3.21.1
Updated on Jun 28, 2025
Languages
6
TypeScript
MDX
JavaScript
CSS
HTML
Dockerfile
TypeScript (82.2%)
MDX (16.96%)
JavaScript (0.71%)
CSS (0.07%)
HTML (0.06%)
Dockerfile (0.01%)
Developer
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
MIT License
39,354 Stars
10,958 Commits
3,443 Forks
201 Watchers
12 Branches
695 Contributors
Updated on Jul 14, 2025
Maintainers
2
Package Meta Information
Latest Version
2.1.0
Package Id
@chakra-ui/image@2.1.0
Unpacked Size
74.22 kB
Size
10.62 kB
File Count
36
NPM Version
9.5.1
Node Version
18.16.1
Published on
Jul 18, 2023
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
2
Dev Dependencies
4
@chakra-ui/image
The Image component is used to display images.
Installation
1yarn add @chakra-ui/image
Import component
1import { Image } from "@chakra-ui/image"
Basic Usage
1import React from "react" 2import { Image } from "@chakra-ui/image" 3 4const Example = () => ( 5 <Image 6 src="photo.png" 7 fallbackSrc="placeholdit.com/200x200" 8 alt="A Placeholder Image" 9 /> 10)
Fallback support
You can provide a fallback image for when there is an error loading the src of
the image. You can also opt out of this behavior by passing the ignoreFallback
prop.
1<Image 2 src="photo.png" 3 fallbackSrc="placeholdit.com/200x200" 4 alt="A Placeholder Image" 5/>
No vulnerabilities found.
Reason
30 commit(s) and 15 issue activity found in the last 90 days -- score normalized to 10
Reason
no dangerous workflow patterns detected
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
no binaries found in the repo
Reason
7 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
- Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-67mh-4wv8-2f99
- Warn: Project is vulnerable to: GHSA-f7f6-9jq7-3rqj
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
Reason
Found 5/25 approved changesets -- score normalized to 2
Reason
dependency not pinned by hash detected -- score normalized to 2
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/issue-stale.yml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/issue-stale.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/quality.yml:43: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/quality.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/quality.yml:56: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/quality.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/quality.yml:69: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/quality.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/quality.yml:17: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/quality.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/quality.yml:30: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/quality.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:20: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/release.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:33: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/release.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/release.yml:46: update your workflow using https://app.stepsecurity.io/secureworkflow/chakra-ui/chakra-ui/release.yml/main?enable=pin
- Warn: containerImage not pinned by hash: sandbox/react-router/Dockerfile:1
- Warn: containerImage not pinned by hash: sandbox/react-router/Dockerfile:6
- Warn: containerImage not pinned by hash: sandbox/react-router/Dockerfile:11
- Warn: containerImage not pinned by hash: sandbox/react-router/Dockerfile:17: pin your Docker image by updating node:20-alpine to node:20-alpine@sha256:fa316946c0cb1f041fe46dda150f3085b71168555e5706ec0c7466a5bae12244
- Info: 0 out of 8 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 1 third-party GitHubAction dependencies pinned
- Info: 0 out of 4 containerImage dependencies pinned
- Info: 2 out of 2 npmCommand dependencies pinned
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Warn: topLevel 'actions' permission set to 'write': .github/workflows/issue-stale.yml:10
- Warn: no topLevel permission defined: .github/workflows/quality.yml:1
- Warn: no topLevel permission defined: .github/workflows/release.yml:1
- Info: no jobLevel write permissions found
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 11 are checked with a SAST tool
Score
4.4
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More