v1.0.0
- Initial release with material presets, blind-embossed phrases, directional graphite rubbing, touch support and static Framer rendering.
ComponentFramer · React · TypeScript · Canvasv1.0.0
Trace PressA tactile Framer background that reveals embossed brand words wherever the pointer lays down a temporary graphite rubbing.
A tactile Framer background that reveals embossed brand words wherever the pointer lays down a temporary graphite rubbing.
ResponsiveAccessibility declaredIsolated demo
Interactive demo
Try it as if it were already yours.
Test the interaction, responsive sizes, and real controls without leaving the product page.
Trace Press / v1.0.0
Opens full viewport inside this same product page.
What it solves
What Trace Press adds to your project
Trace Press turns a background into a quiet physical interaction. Words sit blind-embossed inside archive paper, plaster, terracotta or slate, then appear only where pointer or touch movement lays graphite across the raised letterforms. Every trace fades back into the material on its own. Replace the phrases, type, surface, relief, grain and rubbing behavior in Framer while foreground content remains clickable above it.
01
Graphite appears only across the raised letterforms under the pointer or touch path
02
Archive paper, plaster, terracotta, slate and fully custom material palettes
03
Editable phrases, Framer font control, type scale, row density, angle and relief depth
04
Soft, dry and coarse rubbing textures with adjustable size, pressure, strength and memory
05
Foreground links and controls stay clickable because the component does not block page input
06
Responsive fixed-height rendering for desktop, tablet and mobile compositions
07
Static Framer Canvas and export renderer with no idle animation or timer
08
Reduced-motion support plus optional touch rubbing and directional grain
Use cases
Documented situations for this product release.
- 01
Brand-led landing page backgrounds
- 02
Editorial covers and campaign openings
- 03
Portfolio and studio introductions
- 04
Tactile product and service storytelling
Product gallery
Images and videos published specifically for this release.
Published capabilities
Declared and reviewed values for this specific release; they are not inherited automatically by an update.
- Animation
- Yes
- Interaction
- Yes
- Responsive
- Yes
- Dark mode
- Yes
- Accessibility declared
- Yes
- CMS
- No
- Forms
- No
- Configurable properties
- Yes
Compatibility
- Framer
- Desktop
- Tablet
- Mobile
Dependencies
This release manifest does not list any dependencies.
Requirements
- A Framer project
- A fixed-height frame of at least 260px
- Foreground content placed in a layer above the component when used as a background
Install and use
These instructions are published as part of this release manifest.
Install
- 01Open the verified Framer install link included in the purchase.
- 02Add Trace Press to a fixed-height frame and send it behind the page content that should remain clickable.
- 03Choose a material, replace the imprinted words and tune type scale, rows, angle, depth and grain in Framer's property panel.
- 04Adjust rubbing size, pressure, texture and memory, then test pointer, touch and reduced-motion behavior before publishing.
Documentation
- START-HERE.md provides the English installation sequence and first setup.
- CONTROLS.md documents every English Property Control, range, default and visibility rule.
- README.md explains layering, foreground input and recommended frame sizes.
- LICENSE.md, CHANGELOG.md and SUPPORT.md document permitted use, the release and support.
Accessibility
The published manifest marks this release as accessible and declares keyboard support in its demo. This is product information, not third-party conformance certification.
- Keyboard use
- Declared supported
- Pointer use
- Declared supported
Performance
The demo loads only when you open it, unmounts when closed, and never adds its dependencies to SolveKit’s main bundle.
Changelog
Licenses
Single-use commercial license
Use Trace Press in one personal, commercial or client Framer project. Each additional end product requires another license. Redistribution and resale are prohibited.
Download metadata
Published data for identifying this release file and checking it after download.
- File name
- Trace-Press-v1.0.0.zip
- File size
- 7.9 KB (7,931 bytes)
- SHA-256
- 62818bbb8ede8dbaf66fcb8868b892fd2b6785caf8884c5f00b4971f7b6e22cf
Frequently asked questions
Can I place buttons and text above Trace Press?
Yes. Trace Press is designed as a background and does not block pointer input to foreground content.
Can I use my own words and brand colors?
Yes. Replace the phrases, choose a Framer font and use a preset material or the custom four-color palette.
Does it work on mobile?
Yes. The component is responsive and touch rubbing can be enabled when that interaction suits the page.
What does one license cover?
One purchase covers one personal, commercial or client end product. Additional end products require additional licenses.
Related products
component · Framer · React · TypeScript
Relay Deck
A responsive Framer card stack where the complete deck follows pointer and touch gestures in real time.
component · Framer · React · TypeScript · Framer MotionType Aperture
A cursor-tracked dual-message headline for Framer with five presets, touch, keyboard controls and reduced-motion support.