Powerful and customizable React image picker components built for modern applications and websites. These image pickers are built using React Aria and styled with Tailwind CSS.
The image picker provides 7 adjustment sliders: exposure, contrast, saturation, temperature, tint, highlights, and shadows. Each slider ranges from -100 to 100, with 0 as the default neutral value.
The image picker supports four fill modes: "fill" (stretches to fill), "fit" (scales to fit within bounds), "crop" (fills and crops overflow), and "tile" (repeats the image in a tile pattern).
The image picker supports both click-to-upload and drag-and-drop file selection. Use the onImageChange callback on ImagePicker.Provider to receive the selected File object when a user uploads an image.
Yes, the image picker includes a rotation button that rotates the image 90 degrees clockwise on each click. The rotation is applied in real-time to the canvas preview.
Yes, the image picker uses a compound component pattern. You can use ImagePicker.FillModeSelect and ImagePicker.AdjustmentSliders independently within an ImagePicker.Provider wrapper to build custom layouts.