ChangeCircle

PhlexIcons::Material

Source code

Icon (Variant: :outlined) ↓

With Phlex::Kit

Material::ChangeCircle(variant: :outlined)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::ChangeCircle.new(variant: :outlined)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm4.17-5.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5c-.03 0-.06.01-.09.01L13 9.6l-1.06 1.06-2.83-2.83L11.94 5 13 6.06l-.96.96c1.27.01 2.53.48 3.5 1.44 1.7 1.71 1.91 4.36.63 6.3zm-1.28 1.41L12.06 19 11 17.94l.95-.95a4.97 4.97 0 0 1-3.48-1.46 5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.63 1.04 2.56 1.01L11 14.4l1.06-1.06 2.83 2.83z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm4.17-5.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5c-.03 0-.06.01-.09.01L13 9.6l-1.06 1.06-2.83-2.83L11.94 5 13 6.06l-.96.96c1.27.01 2.53.48 3.5 1.44 1.7 1.71 1.91 4.36.63 6.3zm-1.28 1.41L12.06 19 11 17.94l.95-.95a4.97 4.97 0 0 1-3.48-1.46 5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.63 1.04 2.56 1.01L11 14.4l1.06-1.06 2.83 2.83z"></path>
</svg>

Icon (Variant: :filled) ↓

With Phlex::Kit

Material::ChangeCircle(variant: :filled)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::ChangeCircle.new(variant: :filled)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 17v-2.01H12c-1.28 0-2.56-.49-3.54-1.46a5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.62 1.03 2.54 1.01v-2.14l2.83 2.83L12.06 19zm4.11-4.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5h-.06v2.15L9.11 7.83 11.94 5v2.02c1.3-.02 2.61.45 3.6 1.45 1.7 1.7 1.91 4.35.63 6.29z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 17v-2.01H12c-1.28 0-2.56-.49-3.54-1.46a5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.62 1.03 2.54 1.01v-2.14l2.83 2.83L12.06 19zm4.11-4.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5h-.06v2.15L9.11 7.83 11.94 5v2.02c1.3-.02 2.61.45 3.6 1.45 1.7 1.7 1.91 4.35.63 6.29z"></path>
</svg>

Icon (Variant: :round) ↓

With Phlex::Kit

Material::ChangeCircle(variant: :round)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::ChangeCircle.new(variant: :round)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.91 16.15a.5.5 0 0 1-.85-.35V17H12c-1.28 0-2.56-.49-3.54-1.46a5.005 5.005 0 0 1-1.14-5.3c.19-.51.86-.64 1.24-.25.22.22.27.54.17.82-.46 1.24-.2 2.68.8 3.68.7.7 1.62 1.03 2.54 1.01v-.94c0-.45.54-.67.85-.35l1.62 1.62c.2.2.2.51 0 .71l-1.63 1.61zm2.53-4.13a.78.78 0 0 1-.17-.82c.46-1.24.2-2.68-.8-3.68-.7-.7-1.62-1.04-2.53-1.02v.94c0 .45-.54.67-.85.35L9.46 8.18c-.2-.2-.2-.51 0-.71l1.62-1.62a.5.5 0 0 1 .85.35v.81c1.3-.02 2.61.45 3.6 1.45a5.005 5.005 0 0 1 1.14 5.3c-.19.52-.85.65-1.23.26z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.91 16.15a.5.5 0 0 1-.85-.35V17H12c-1.28 0-2.56-.49-3.54-1.46a5.005 5.005 0 0 1-1.14-5.3c.19-.51.86-.64 1.24-.25.22.22.27.54.17.82-.46 1.24-.2 2.68.8 3.68.7.7 1.62 1.03 2.54 1.01v-.94c0-.45.54-.67.85-.35l1.62 1.62c.2.2.2.51 0 .71l-1.63 1.61zm2.53-4.13a.78.78 0 0 1-.17-.82c.46-1.24.2-2.68-.8-3.68-.7-.7-1.62-1.04-2.53-1.02v.94c0 .45-.54.67-.85.35L9.46 8.18c-.2-.2-.2-.51 0-.71l1.62-1.62a.5.5 0 0 1 .85.35v.81c1.3-.02 2.61.45 3.6 1.45a5.005 5.005 0 0 1 1.14 5.3c-.19.52-.85.65-1.23.26z"></path>
</svg>

Icon (Variant: :sharp) ↓

With Phlex::Kit

Material::ChangeCircle(variant: :sharp)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::ChangeCircle.new(variant: :sharp)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 17v-2.01H12c-1.28 0-2.56-.49-3.54-1.46a5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.62 1.03 2.54 1.01v-2.14l2.83 2.83L12.06 19zm4.11-4.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5h-.06v2.15L9.11 7.83 11.94 5v2.02c1.3-.02 2.61.45 3.6 1.45 1.7 1.7 1.91 4.35.63 6.29z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 17v-2.01H12c-1.28 0-2.56-.49-3.54-1.46a5.006 5.006 0 0 1-.64-6.29l1.1 1.1c-.71 1.33-.53 3.01.59 4.13.7.7 1.62 1.03 2.54 1.01v-2.14l2.83 2.83L12.06 19zm4.11-4.24-1.1-1.1c.71-1.33.53-3.01-.59-4.13A3.482 3.482 0 0 0 12 8.5h-.06v2.15L9.11 7.83 11.94 5v2.02c1.3-.02 2.61.45 3.6 1.45 1.7 1.7 1.91 4.35.63 6.29z"></path>
</svg>

Icon (Variant: :two_tone) ↓

With Phlex::Kit

Material::ChangeCircle(variant: :two_tone)

Without Phlex::Kit (e.g. ERB) ↓

render PhlexIcons::Material::ChangeCircle.new(variant: :two_tone)

Plain Phlex ↓

def view_template
	svg(
		**attrs,
		fill: 'currentColor',
		xmlns: 'http://www.w3.org/2000/svg', viewbox: '0 0 24 24'
	) do |s|
		s.path(
			d:
				'M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8-8-3.59-8-8 3.59-8 8-8m.06 9.34v2.14a3.46 3.46 0 0 1-2.54-1.01c-1.12-1.12-1.3-2.8-.59-4.13l-1.1-1.1c-1.28 1.94-1.07 4.59.64 6.29A4.95 4.95 0 0 0 12 17h.06v2l2.83-2.83-2.83-2.83zm3.48-4.88c-.99-.99-2.3-1.46-3.6-1.45V5L9.11 7.83l2.83 2.83V8.51H12c.9 0 1.79.34 2.48 1.02 1.12 1.12 1.3 2.8.59 4.13l1.1 1.1a5.032 5.032 0 0 0-.63-6.3z',
			opacity: '.3'
		)
		s.path(
			d:
				'M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8-8-3.59-8-8 3.59-8 8-8m0-2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 11.34v2.14a3.46 3.46 0 0 1-2.54-1.01c-1.12-1.12-1.3-2.8-.59-4.13l-1.1-1.1c-1.28 1.94-1.07 4.59.64 6.29A4.95 4.95 0 0 0 12 17h.06v2l2.83-2.83-2.83-2.83zm3.48-4.88c-.99-.99-2.3-1.46-3.6-1.45V5L9.11 7.83l2.83 2.83V8.51H12c.9 0 1.79.34 2.48 1.02 1.12 1.12 1.3 2.8.59 4.13l1.1 1.1a5.032 5.032 0 0 0-.63-6.3z'
		)
	end
end

Plain SVG ↓

<svg xmlns="http://www.w3.org/2000/svg" class="" fill="currentColor" viewbox="0 0 24 24">
	<path d="M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8-8-3.59-8-8 3.59-8 8-8m.06 9.34v2.14a3.46 3.46 0 0 1-2.54-1.01c-1.12-1.12-1.3-2.8-.59-4.13l-1.1-1.1c-1.28 1.94-1.07 4.59.64 6.29A4.95 4.95 0 0 0 12 17h.06v2l2.83-2.83-2.83-2.83zm3.48-4.88c-.99-.99-2.3-1.46-3.6-1.45V5L9.11 7.83l2.83 2.83V8.51H12c.9 0 1.79.34 2.48 1.02 1.12 1.12 1.3 2.8.59 4.13l1.1 1.1a5.032 5.032 0 0 0-.63-6.3z" opacity=".3"></path>
	<path d="M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8-8-3.59-8-8 3.59-8 8-8m0-2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm.06 11.34v2.14a3.46 3.46 0 0 1-2.54-1.01c-1.12-1.12-1.3-2.8-.59-4.13l-1.1-1.1c-1.28 1.94-1.07 4.59.64 6.29A4.95 4.95 0 0 0 12 17h.06v2l2.83-2.83-2.83-2.83zm3.48-4.88c-.99-.99-2.3-1.46-3.6-1.45V5L9.11 7.83l2.83 2.83V8.51H12c.9 0 1.79.34 2.48 1.02 1.12 1.12 1.3 2.8.59 4.13l1.1 1.1a5.032 5.032 0 0 0-.63-6.3z"></path>
</svg>