Culinary Assets

130 illustrations · CC0 artwork · AI-generated

Catalog

Install & license

Install from npm

The package is available from the public npm registry. No npm account, access token or Git installation is needed to use it. Install it in your Node.js project with your preferred package manager.

npm

npm install @cosmintrica/culinary-assets

pnpm

pnpm add @cosmintrica/culinary-assets

View the npm package. Add @0.4.0 to the package name to pin this release, and commit your lockfile for reproducible installs.

There are 130 separate PNGs and 130 separate WebPs, plus optional 1x/2x sprite atlases. The sheets in the README are previews; individual imports remain available.

Web / React / Vite

Import individual images to include only the assets your app needs.

import tomato from '@cosmintrica/culinary-assets/webp/tomato.webp';

<img src={tomato} width={80} height={80} alt="Tomato" />

Plain HTML can use copied files directly. For a dynamic gallery, the package's web entry also exports assets, catalog and getAsset(). SSR frameworks may need static imports or a public-directory copy instead of Node file URLs.

Optional web sprites

One atlas for dense icon grids; individual images remain the default. The optional entry exports immutable coordinates for every subject.

import { spriteUrl, sprites, spriteWidth, spriteHeight }
  from '@cosmintrica/culinary-assets/sprite';

const { x, y, width, height } = sprites.tomato;
// x: 0, y: 0, width: 128, height: 128
const style = {
  width, height,
  backgroundImage: `url("${spriteUrl}")`,
  backgroundRepeat: 'no-repeat',
  backgroundPosition: `${-x}px ${-y}px`,
  backgroundSize: `${spriteWidth}px ${spriteHeight}px`,
};

The default atlas is 1664 × 1280 with 128px tiles. sprite2xUrl offers 256px tiles on a 3328 × 2560 image; use the same CSS coordinates and background size. For 64px icons, multiply all logical coordinates and background dimensions by 0.5. Individual PNG/WebP files remain 512px.

Expo / React Native

Use static PNG requires for Metro on iOS and Android.

import { Image } from 'react-native';

const tomato = require('@cosmintrica/culinary-assets/png/tomato.png');

<Image source={tomato} resizeMode="contain"
  style={{ width: 80, height: 80 }} accessibilityLabel="Tomato" />

The @cosmintrica/culinary-assets/native entry exports nativeAssets with all 130 static sources. Individual imports keep your bundle smaller. Verify layout and rendering in your own native development build.

Artwork and metadata: CC0 1.0

Copy, modify, redistribute and use the images commercially under CC0. Attribution is appreciated, not required. The dedication applies to rights the contributor may hold, not patents, trademarks or other people's rights.

Official CC0 terms · Asset dedication · Full legal code

Code, examples and documentation: MIT

The software may be used and modified under MIT. Preserve its copyright and permission notice when distributing copies or substantial portions of the software.

Read the MIT license

Provenance and limitations

These raster illustrations were generated with the built-in OpenAI image-generation tool, visually reviewed and exported with genuine transparency. They are not hand-drawn vector icons or product photographs.

Each individual PNG/WebP uses a 512 × 512 canvas with padding. The original 54 subjects may be upscaled from atlas cells; 76 additions use individual high-resolution sources (at least 1179px on the shorter edge). AI-generated material can have different copyright status across jurisdictions; no guarantee of uniqueness or third-party clearance is made. Assets are supplied as-is, without warranties or endorsement.

Generation briefs · Report an issue