Yarik'sPluginLib & Fast lightweight Color picker

Yarik’sPluginLib is a common library im using for my plugins

I think that it would be nice to document it incase any of yall want to use it/fork it

Installation (click any of 2 images below)

installlib Lib'sSource

Color picker

It’s a POP-up widget that can be spawned by you using the “ColorPalette” library.
It is very simple, fast, and lightweight to use. (uses fast metamethod calls from RawLib)

Libraries

I put here the most common lightweight libraries that i use.
image
ColorPalette is this plugin itself.
NormalSignal
HierarchyBuilder (forked)
RawLib

Getting it setup for your plugin.

  • Instal Yarik’sPluginLib
  • Give it required permissions (Needed for ColorPalette library to initiate)
  • Adding halting of code untill Yarik’sPluginLib is loaded.
--!strict
local HttpService = game:GetService("HttpService")
local PluginGuiService = game:GetService("PluginGuiService")
local RunService = game:GetService("RunService")

local Lib = PluginGuiService:WaitForChild("Yarik'sPluginLib",10)
if Lib~=nil and Lib:GetAttribute("Initialized")~=true then RunService.Heartbeat:Wait() end
if Lib==nil or Lib:GetAttribute("Initialized")~=true then
	--Not found
	local Yield = Instance.new("BindableEvent")
	local widget = plugin:CreateDockWidgetPluginGui(HttpService:GenerateGUID(),DockWidgetPluginGuiInfo.new(Enum.InitialDockState.Float,false,false,500,500,500,500))
	widget.Title=plugin.Name
	widget.Name=plugin.Name
	local Frame = Instance.new("Frame")Frame.AnchorPoint=Vector2.new(0.5,0.5)Frame.BackgroundColor3=Color3.fromHex("#232323")Frame.Position=UDim2.new(0.5,0,0.5,0)Frame.Size=UDim2.new(1,0,1,0)
	local Label = Instance.new("TextLabel")Label.Size=UDim2.new(1,0,0.35,0)Label.BackgroundTransparency=1 Label.TextColor3=Color3.new(1,0,0)Label.TextScaled=true Label.Text="Yarik'sPluginLib not found"
	local TextButton = Instance.new("TextButton")TextButton.Position=UDim2.new(0.109,0,0.544,0)TextButton.Size=UDim2.new(0.782,0,0.359,0)TextButton.BackgroundColor3=Color3.new(0,0.3,0)TextButton.BorderSizePixel=0 TextButton.TextColor3=Color3.new(1,1,1)TextButton.TextScaled=true TextButton.Text="Retry"
	TextButton.MouseButton1Click:Connect(function()
		local Lib = PluginGuiService:FindFirstChild("Yarik'sPluginLib")
		if Lib and Lib:GetAttribute("Initialized") then
			Yield:Fire()
			Yield:Destroy()
			widget:Destroy()
		end
	end)
	TextButton.Parent=Frame
	Label.Parent=Frame
	Frame.Parent=widget
	widget.Enabled=true
	Yield.Event:Wait()
end
local Lib = PluginGuiService:WaitForChild("Yarik'sPluginLib",10)
if Lib==nil then error("Yarik'sPluginLib not found") return end
--Grabbing libraries
local HierarchyBuilder = require(Lib:WaitForChild("HierarchyBuilder"))
local ColorPalette = require(Lib:WaitForChild("ColorPalette"))
local RawLib = require(Lib:WaitForChild("RawLib"))
local NormalSignal = require(Lib:WaitForChild("NormalSignal"))
local Unloading:boolean = false
local function Lib_Destroying()
	RunService.Heartbeat:Wait()--Incase of imideat events
	if Unloading then return end
	local Lib = PluginGuiService:WaitForChild("Yarik'sPluginLib")
	if Lib==nil then error("Yarik'sPluginLib not found") return end
	Lib:GetPropertyChangedSignal("Parent"):Once(Lib_Destroying)
	HierarchyBuilder = require(Lib:WaitForChild("HierarchyBuilder"))
	ColorPalette = require(Lib:WaitForChild("ColorPalette"))
	RawLib = require(Lib:WaitForChild("RawLib"))
	NormalSignal = require(Lib:WaitForChild("NormalSignal"))
	setproperty = RawLib.instance_newindex
	getproperty = RawLib.instance_index
	vector2_index = RawLib.vector2_index
	color3_index = RawLib.color3_index
	udim2_index = RawLib.udim2_index

	ColorPalette_SetColor = ColorPalette.SetColor
	ColorPalette_NewTask = ColorPalette.CreatePaletteTask
end
Lib:GetPropertyChangedSignal("Parent"):Once(Lib_Destroying)
plugin.Unloading:Once(function():()
	Unloading=true
end)

--Your plugin here

Color palette API & How to access libraries

--!strict
--[[Service]]
local PluginGuiService = game:GetService("PluginGuiService")
--[[Grabbing API]]
local Lib = PluginGuiService["Yarik'sPluginLib"]
local Palette = require(Lib.ColorPalette)
local Create_Palette = Palette.CreatePaletteTask
local SetColor = Palette.SetColor

Now you have 2 functions: Create_Picker and SetColor

SetColor requires you to put a Color3 value and also has second argument that is mostly used internally “IgnoreCursors” that represents Should sliders in Color paletter move after setting color and if you leave it empty then they will.
Create_Picker allows you to call palette itself!
It has 5 properties:

“Title” that represents that; Allowing you to distinguish tasks

image

“Cancel” here you need to put a function and Upon closing/canceling ColorPicker it will send you Last Color and will return everything past 4th argument

“Ended” will return the color and will return everything past 4th argument

“ChangedEvent” is a optional parameter that will fire upon you changing color, it does return color and will return everything past 4th argument

“Tuple” is just set of arguments that will get returned to every function i mentioned above.

Bonus:

To quickly debug you can use Execute script with plugin capability!

1 Like

I updated the Library Color picker’s Outline now should scale properly
Also fixed some minor bugs

What’s a use case for a color picker plugin? Roblox already has a built-in one ready to use whenever you need to pick a color.

We as developers can’t use the built-in color picker, the only workaround we have to use the built in color picker is using a colorvalue and asking the user to pick a color but there’s no apis to use the studio one.

1 Like

At first I was confused the same as avocado

But after a bit of reading I think I understand, its for plugins.
This is very useful but I would work on the UI a bit as it is slacking behind but other then that. Very Nice!

I did do a bit of work on the ui but its not my best work lol.
UpgradedUI.rbxm (18.5 KB)

2 Likes

The UI looks very good, but I tried to reach for a Studio Editor-like style.


Feel free to fork my plugin if you feel like it.
Lib'sSource

Oh in that case its very well made, to replicate the feel you could also add the Up & Down arrows!
And for the input fields like Hex its just a Dark Gray background with a black stroke (1 px)

Hope this helps!

2 Likes

Update #1

Compared to old one

  • Color picker now matches studio theme
  • Update version of NormalSignal library
  • Updated Post; Now everything will work even if you updated the library!
    Pretty cool right?It automatically rewrites functions upon update

Light theme jumpscare

Perfection, I didn’t expect you to nail it on the spot but that is actually perfect!
To make it more accurate I would remove UI Corners but thats totally up to you.

1 Like