k. PLAY DEPT.
KENNEY UI PACK / 2.0← Marketplace
Small pieces. Big personality.

Made to
be pressed.

Bright buttons. Satisfying clicks. A little joy for every interface.100% FREE

Blue checkmark
Yellow checked control
Green button
01 / The playgroundGo on, click it.

Your next quest.

A tiny menu, made with real pack artwork.

Ready when you are.
02 / Make it yoursLive controls

A color for every mood.

Try the actual vector buttons in five colorways. The controls here demonstrate how the art can feel in your own interface.

Show encouragement
03 / Open the parts drawer

Little things, all included.

35 actual SVG samples · 434 SVG designs in the complete pack

BLUE / SVGbutton rectangle border.svg

Vector/Blue/button_rectangle_border.svg

BLUE / SVGbutton rectangle depth gradient.svg

Vector/Blue/button_rectangle_depth_gradient.svg

BLUE / SVGbutton square depth gradient.svg

Vector/Blue/button_square_depth_gradient.svg

BLUE / SVGcheck square color checkmark.svg

Vector/Blue/check_square_color_checkmark.svg

BLUE / SVGcheck square grey checkmark.svg

Vector/Blue/check_square_grey_checkmark.svg

BLUE / SVGicon checkmark.svg

Vector/Blue/icon_checkmark.svg

BLUE / SVGicon outline checkmark.svg

Vector/Blue/icon_outline_checkmark.svg

GREEN / SVGbutton rectangle border.svg

Vector/Green/button_rectangle_border.svg

GREEN / SVGbutton rectangle depth gradient.svg

Vector/Green/button_rectangle_depth_gradient.svg

GREEN / SVGbutton square depth gradient.svg

Vector/Green/button_square_depth_gradient.svg

GREEN / SVGcheck square color checkmark.svg

Vector/Green/check_square_color_checkmark.svg

GREEN / SVGcheck square grey checkmark.svg

Vector/Green/check_square_grey_checkmark.svg

GREEN / SVGicon checkmark.svg

Vector/Green/icon_checkmark.svg

GREEN / SVGicon outline checkmark.svg

Vector/Green/icon_outline_checkmark.svg

GREY / SVGbutton rectangle border.svg

Vector/Grey/button_rectangle_border.svg

GREY / SVGbutton rectangle depth gradient.svg

Vector/Grey/button_rectangle_depth_gradient.svg

GREY / SVGbutton square depth gradient.svg

Vector/Grey/button_square_depth_gradient.svg

GREY / SVGcheck square color checkmark.svg

Vector/Grey/check_square_color_checkmark.svg

GREY / SVGcheck square grey checkmark.svg

Vector/Grey/check_square_grey_checkmark.svg

GREY / SVGicon checkmark.svg

Vector/Grey/icon_checkmark.svg

GREY / SVGicon outline checkmark.svg

Vector/Grey/icon_outline_checkmark.svg

RED / SVGbutton rectangle border.svg

Vector/Red/button_rectangle_border.svg

RED / SVGbutton rectangle depth gradient.svg

Vector/Red/button_rectangle_depth_gradient.svg

RED / SVGbutton square depth gradient.svg

Vector/Red/button_square_depth_gradient.svg

RED / SVGcheck square color checkmark.svg

Vector/Red/check_square_color_checkmark.svg

RED / SVGcheck square grey checkmark.svg

Vector/Red/check_square_grey_checkmark.svg

RED / SVGicon checkmark.svg

Vector/Red/icon_checkmark.svg

RED / SVGicon outline checkmark.svg

Vector/Red/icon_outline_checkmark.svg

YELLOW / SVGbutton rectangle border.svg

Vector/Yellow/button_rectangle_border.svg

YELLOW / SVGbutton rectangle depth gradient.svg

Vector/Yellow/button_rectangle_depth_gradient.svg

YELLOW / SVGbutton square depth gradient.svg

Vector/Yellow/button_square_depth_gradient.svg

YELLOW / SVGcheck square color checkmark.svg

Vector/Yellow/check_square_color_checkmark.svg

YELLOW / SVGcheck square grey checkmark.svg

Vector/Yellow/check_square_grey_checkmark.svg

YELLOW / SVGicon checkmark.svg

Vector/Yellow/icon_checkmark.svg

YELLOW / SVGicon outline checkmark.svg

Vector/Yellow/icon_outline_checkmark.svg

Your next interface starts here.

Get the complete pack ↗