react-native-skia Documentation
React Native Skia documentation. Use for high-performance 2D graphics, shaders, animations, canvas rendering, image filters, path effects, and Skia API in React Native.
Documentation Structure
contents/
├── getting-started/ # Installation, hello world, web, headless, bundle size (5 files)
├── canvas/ # Canvas component and contexts (2 files)
├── shapes/ # Paths, ellipses, boxes, polygons, vertices, atlas, patch, pictures (8 files)
├── animations/ # Reanimated 3 integration, hooks, gestures, textures (4 files)
├── shaders/ # Gradients, colors, image shaders, SKSL language, Perlin noise (5 files)
├── image-filters/ # Blur, shadows, displacement, morphology, runtime shaders (7 files)
├── text/ # Text, blobs, glyphs, paragraphs, text on path (5 files)
├── paint/ # Paint overview and properties (2 files)
└── (root) # Images, SVG, masks, filters, effects, video, Skottie (13 files)
Topic Guide
| Topic |
Key Files |
| Installation & Setup |
contents/getting-started/installation.md, contents/getting-started/hello-world.md |
| Web support |
contents/getting-started/web.mdx |
| Canvas rendering |
contents/canvas/canvas.md, contents/canvas/contexts.md |
| Drawing shapes |
contents/shapes/path.md, contents/shapes/ellipses.md, contents/shapes/box.md |
| Animations (Reanimated) |
contents/animations/reanimated3.md, contents/animations/hooks.md |
| Gestures |
contents/animations/gestures.md |
| Shaders & gradients |
contents/shaders/gradients.md, contents/shaders/language.md |
| Image filters & blur |
contents/image-filters/blur.md, contents/image-filters/overview.md |
| Shadows |
contents/image-filters/shadows.md |
| Custom shaders (SKSL) |
contents/shaders/language.md, contents/image-filters/runtime-shader.md |
| Text rendering |
contents/text/text.md, contents/text/paragraph.md |
| Images & SVG |
contents/image.md, contents/image-svg.md |
| Masking & clipping |
contents/mask.md, contents/group.md |
| Path effects |
contents/path-effects.md |
| Performance |
contents/shapes/pictures.md, contents/snapshot-views.md |
| Video |
contents/video.md |
| Lottie / Skottie |
contents/skottie.md |
When to use
Use this skill when the user asks about:
- Drawing 2D graphics in React Native (shapes, paths, images)
- Shaders, gradients, and visual effects in React Native
- Animating canvas content with Reanimated or gesture handlers
- Image filters: blur, drop shadow, displacement maps, morphology
- Text rendering, paragraphs, and text along paths
- Skia API usage: Paint, Canvas, Groups, Masks
- Video rendering, Lottie animations (Skottie)
- Web support or headless Skia rendering
How to find information
- Use Topic Guide above to identify relevant files
- Read
TOC.md for complete file listing by directory
- Read specific files from
contents/{path}
Source: olorehq/olore — distributed by TomeVault.
1---2name: olore-react-native-skia-2-2-123description: Local react-native-skia documentation reference (2.2.12). React Native Skia documentation. Use for high-performance 2D graphics, shaders, animations, canvas rendering, image filters, path effects, and Skia API in React Native. Use when this capability is needed.4---56# react-native-skia Documentation78React Native Skia documentation. Use for high-performance 2D graphics, shaders, animations, canvas rendering, image filters, path effects, and Skia API in React Native.910## Documentation Structure1112```13contents/14├── getting-started/ # Installation, hello world, web, headless, bundle size (5 files)15├── canvas/ # Canvas component and contexts (2 files)16├── shapes/ # Paths, ellipses, boxes, polygons, vertices, atlas, patch, pictures (8 files)17├── animations/ # Reanimated 3 integration, hooks, gestures, textures (4 files)18├── shaders/ # Gradients, colors, image shaders, SKSL language, Perlin noise (5 files)19├── image-filters/ # Blur, shadows, displacement, morphology, runtime shaders (7 files)20├── text/ # Text, blobs, glyphs, paragraphs, text on path (5 files)21├── paint/ # Paint overview and properties (2 files)22└── (root) # Images, SVG, masks, filters, effects, video, Skottie (13 files)23```2425## Topic Guide2627| Topic | Key Files |28|-------|-----------|29| Installation & Setup | `contents/getting-started/installation.md`, `contents/getting-started/hello-world.md` |30| Web support | `contents/getting-started/web.mdx` |31| Canvas rendering | `contents/canvas/canvas.md`, `contents/canvas/contexts.md` |32| Drawing shapes | `contents/shapes/path.md`, `contents/shapes/ellipses.md`, `contents/shapes/box.md` |33| Animations (Reanimated) | `contents/animations/reanimated3.md`, `contents/animations/hooks.md` |34| Gestures | `contents/animations/gestures.md` |35| Shaders & gradients | `contents/shaders/gradients.md`, `contents/shaders/language.md` |36| Image filters & blur | `contents/image-filters/blur.md`, `contents/image-filters/overview.md` |37| Shadows | `contents/image-filters/shadows.md` |38| Custom shaders (SKSL) | `contents/shaders/language.md`, `contents/image-filters/runtime-shader.md` |39| Text rendering | `contents/text/text.md`, `contents/text/paragraph.md` |40| Images & SVG | `contents/image.md`, `contents/image-svg.md` |41| Masking & clipping | `contents/mask.md`, `contents/group.md` |42| Path effects | `contents/path-effects.md` |43| Performance | `contents/shapes/pictures.md`, `contents/snapshot-views.md` |44| Video | `contents/video.md` |45| Lottie / Skottie | `contents/skottie.md` |4647## When to use4849Use this skill when the user asks about:50- Drawing 2D graphics in React Native (shapes, paths, images)51- Shaders, gradients, and visual effects in React Native52- Animating canvas content with Reanimated or gesture handlers53- Image filters: blur, drop shadow, displacement maps, morphology54- Text rendering, paragraphs, and text along paths55- Skia API usage: Paint, Canvas, Groups, Masks56- Video rendering, Lottie animations (Skottie)57- Web support or headless Skia rendering5859## How to find information60611. Use Topic Guide above to identify relevant files622. Read `TOC.md` for complete file listing by directory633. Read specific files from `contents/{path}`6465---66> Source: [olorehq/olore](https://github.com/olorehq/olore) — distributed by [TomeVault](https://tomevault.io).67<!-- tomevault:4.0:skill_md:2026-07-04 -->